Base card
A short line of supporting text.
.card-base .bg-surface-lighter
Compact card
A short line of supporting text.
.card-compact .bg-surface-lighter
Interactive card
A short line of supporting text.
.card-interactive .bg-surface-lighter
Featured card
A short line of supporting text.
.card-featured
With a shadow
A short line of supporting text.
.card-base .shadow-md .bg-surface-lighter
With a border
A short line of supporting text.
.card-base .border-xs .border-light .bg-surface-lighter
Large card
A short line of supporting text.
.card-large .bg-surface-lighter
Horizontal card
A short line of supporting text.
.card-base .flex .align-center .gap-sm .bg-surface-lighter
Call to action
A short line of supporting text.
.card-large .shadow-md .bg-surface-lighter