Cards
Cards are surfaces that display content and actions on a single topic. They should be easy to scan for relevant and actionable information. Elements, like text and images, should be placed on them in a way that clearly indicates hierarchy.
Cards with badges
Card with badge is used to display the products details i.e., best seller, new, Type, Fixed badge, Price, Discount and stock.
Apple
Cards with dismiss
In this card we have dismiss button for dismiss this card.
Apple
Cards with text overlay
In this card we have Out of Stock text over image of card.
Apple
Text only cards
Simple Card is the one that contains a title, a descriptive text. To use the Card Component, card-title, and card-text inside a div with class card.
T-20 World Cup
Horizontal cards
Horizontal cards are used in Ecommerece websites in cart section along with details of that particular product.
Apple
Card with shadow
Cards with shadow uses for attractive designs,we can see shadow on this card.
Apple