What is it?
A Card is a layout option that displays an image on top and information below.
Elements
- Image: Displays at the top of the card.
- Heading: Describes the topic of the card and links to more details about the topic
- Text: Provides descriptive details about the topic and links.
- Call to action link (optional): Describes the link destination.
Note: Cards should be placed in a Layout Container, where you select the number of columns across in the grid. The layout container provides layout options for Cards, Horizontal Cards and List Items. Horizontal Cards only allow a max of 2 across on Desktop due to their orientation.
How do you use it?
- Use a group of Vertical Cards to provide entry points to more detailed information about topics or tasks.
- Include one card per topic, featuring a concise summary and links that encourage further exploration.
- Select images that fit the Vertical Card aspect ratio to maintain visual balance and consistency.
- Provide a brief, clear summary of the topic or task supported by the linked content.
- Use Vertical Cards only in areas with sufficient space; avoid placing them in narrow regions constrained by side navigation or other page elements.
