Card

Use the story controls to explore the Card atom's properties.

Props

The Card atom provides a structured surface with distinct sections:

• CardHeader: Header section with title functionality
• CardPanel: Main content area
• CardTitle: Title component for the header
• Frame: Optional muted wrapper for raising a card above a footer strip

Usage

This UI module is also available from @exegia/corpora-ui/ui/card.

import { Card, CardHeader, CardPanel, CardTitle, Frame, FrameFooter } from "@exegia/corpora-ui"

<Card>
  <CardHeader><CardTitle>Title</CardTitle></CardHeader>
  <CardPanel>Content</CardPanel>
</Card>

<Frame>
  <Card>…</Card>
  <FrameFooter>Fine print below the card.</FrameFooter>
</Frame>

Frame