Card

Card is a universal container that contains content and actions related to a specific topic or subject. The purpose of using cards is to group information, allowing users to browse a collection of related items or actions.
It can have the form of a simple box with text or it can contain additional elements like an image or buttons

Component Status

Figma

Up to date

Status

Stable

HTML

Up to date

React

Up to date

Twig

Not scheduled

Design usage

  • Card can be a standalone element in the page to display content that should be separated or should stand out from the page, but more often multiple cards are used to display partial information belonging to the same topic, e.g. news articles in the news section