BRAID
Braid Design System
GuidesFoundationsComponentsPatternsStyles
Sections

Card list

A section pattern for displaying a list of items as cards, providing visual separation and a consistent structure for each item.

Heading (optional)

  • Heading level 4

    Standard text
    Standard text lorem ipsum dolor sit amet consectetur adipiscing elit. Vivamus iaculis ut neque sit amet egestas.Standard, secondary text

  • Heading level 4

    Standard text
    Standard text lorem ipsum dolor sit amet consectetur adipiscing elit. Vivamus iaculis ut neque sit amet egestas.Standard, secondary text

  • Heading level 4

    Standard text
    Standard text lorem ipsum dolor sit amet consectetur adipiscing elit. Vivamus iaculis ut neque sit amet egestas.Standard, secondary text
 
Open in Playroom

Usage

Use when displaying a collection of similar items — such as search results or records — that benefit from defined visual boundaries. For lightweight lists without card treatment, consider the Divided list pattern instead.