Cards

Examples and documentation for the cards component

Variant: Default

Default Default

Card body content for default default.

Primary Default

Card body content for primary default.

Success Default

Card body content for success default.

Warning Default

Card body content for warning default.

Danger Default

Card body content for danger default.

Info Default

Card body content for info default.

Light Default

Card body content for light default.

Secondary Default

Card body content for secondary default.

Variant: Outlined

Default Outlined

Card body content for default outlined.

Primary Outlined

Card body content for primary outlined.

Success Outlined

Card body content for success outlined.

Warning Outlined

Card body content for warning outlined.

Danger Outlined

Card body content for danger outlined.

Info Outlined

Card body content for info outlined.

Light Outlined

Card body content for light outlined.

Secondary Outlined

Card body content for secondary outlined.

Variant: Filled

Default Filled

Card body content for default filled.

Primary Filled

Card body content for primary filled.

Success Filled

Card body content for success filled.

Warning Filled

Card body content for warning filled.

Danger Filled

Card body content for danger filled.

Info Filled

Card body content for info filled.

Light Filled

Card body content for light filled.

Secondary Filled

Card body content for secondary filled.

Variant: Solid

Default Solid

Card body content for default solid.

Primary Solid

Card body content for primary solid.

Success Solid

Card body content for success solid.

Warning Solid

Card body content for warning solid.

Danger Solid

Card body content for danger solid.

Info Solid

Card body content for info solid.

Light Solid

Card body content for light solid.

Secondary Solid

Card body content for secondary solid.

Collapsible Cards

Collapsed by default
Expanded by default

This card starts expanded. Click the header toggle to collapse.