Card.
A card is a group of related information, generally comprising of an
Image, headers and footers, a wide variety
of content, and sometimes also has a call to action button. There are various types like basic vertical/horizontal card
card with badge, card with text overlay, card with dismiss and text only card.
of content, and sometimes also has a call to action button. There are various types like basic vertical/horizontal card
card with badge, card with text overlay, card with dismiss and text only card.
Text only card
This card has a title & paragraph text which can be used as a simple text
content card.
Heading
Sub-Heading
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text typesetting industry.
Vertical Card
Vertical cards are the most common type of cards seen used across
multiple platforms.
You add a badge using card-badge class inside a div.
You add a badge using card-badge class inside a div.
Nike Mercurial 8 'KM'
Football boot
₹4599
₹7999
60% off
TRENDING
Nike Mercurial Vapor
Football boot
₹4599
₹7999
60% off
Horizontal Card
Similar content structure just with a horizontal alignment.
Nike Mercurial 8 'KM' Turf
Football boot
₹6599
₹8999
30% off
Card with dismiss
Card with Dismiss includes a icon on top right corner which acts as a
dismiss button.
Heading
Sub-Heading
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text typesetting industry.
Card with text overlay
This card has a text overlay on top of it used for indication of an
unavailable card.
Nike Mercurial 8 'KM'
Football boot
₹4599
₹7999
60% off