Components · Surfaces

Card

A raised panel with a title and a printed label. Inset and outline variants sit lower.

jsx

import { Card } from '@andeus/ui';

Variants

Raised

Content

Default

Inset

Content

Recessed

Outline

Content

Flat

jsx

<Card title="Raised" label="Default">Content</Card>
<Card title="Inset" label="Recessed" variant="inset">Content</Card>
<Card title="Outline" label="Flat" variant="outline">Content</Card>

Props

Prop	Type	Default
title	`string \| ReactNode`	—
label	`string \| ReactNode`	—	Printed under the card.
action	`ReactNode`	—	Top-right slot.
variant	`'raised' \| 'inset' \| 'outline'`	'raised'
padding	`number \| string`	16
children	`ReactNode`	—

PreviousTooltip NextWindow