Skip to content

Components

Cards

Variants States Usage

When NOT to reach for a card

Three constraints behind when cards belong + when they don't. A single rounded panel on its own reads as a floating box; pair them in a grid or pick an editorial alternative (pull-quote, left-rule callout).

  • Cards always sit in a grid of ≥2. Standalone rounded panels read boxy.
  • Card background is pure white (#FFFFFF) - pops above paper-tinted sections.
  • For a single callout, prefer a left-rule pull-quote or plain editorial typography.
Cards · States
Forms · Inputs