Cards and panes

Use cards for a set of peer summaries that people can scan and compare.

Use a pane for an independent region with enough content or actions to need its own heading.

Cards adapt to their container and wrap long content and actions without horizontal overflow.

• Keep headings in the page hierarchy; the components do not choose heading levels.
• Use cards as peer summaries and panes as larger, independent page regions.
• Use a clear action link instead of linking the heading or overlaying a link across the whole card.
• Keep content destinations blue and use current-color links for secondary card and pane actions.