Cards are an extremely popular unit of web design that aim to display content in snack-sized cards that are easy to comprehend. Silva fully embraces the concept of cards and offer rich and flexible display options to cater for many needs.
At their core, cards have a body element that can contain anything. Optionally, they have a header and/or a footer.
Cards can be clickable as a whole, not at all, or not be clickable yet have internal clickable links.
Cards can have borders, and optionally a hero element.
Cards will take on equal height across a row when used in a grid with the equal height grid modifier.
The hero and content elements can be switched in order, both horizontally and vertically.
Emblems are an optional element that overlays the edge between the hero and content sections.
A beautitful use of the media object atomic is to place it in the card's body element. Below are various media object configurations placed inside cards, both in a normal and a equal height grid.
In overlay mode, the hero element acts as a full background, with the content element laid on top of it.
Ratio content (content that maintains its aspect ratio) can be placed in any of the cards' sections.