Anatomy

Anatomy.png

  1. Card content

Properties

The Simple Card is a wrapper component with a predefined set of styles.

Density

Density.png

Color Theme

Simple Color Theme.png

Object Style

Object Style.png

Dismissable

Dismiss.png

Behavior

Since Simple Card is content agnostic and its behavior/interactivity is reliant on its inner content.

Behavior.png

Usage

Guidelines

Use a card to encapsulate a single idea or topic.

Use a card to encapsulate a single idea or topic.

Be mindful of visual contrast when applying color themes and object styles to cards.

Be mindful of visual contrast when applying color themes and object styles to cards.