Card

Container with border and optional padding. Compound component with Header, Title, Body, Action sub-components.

Preview

Usage

import { Card } from '@ramtt/ui'

<Card>
  <Card.Header>
    <Card.Title>Title</Card.Title>
  </Card.Header>
  <Card.Body>Content here</Card.Body>
</Card>
<Card padding="lg">Large padding</Card>
<Card padding="none">No padding</Card>

Props

Prop	Type	Default	Description
padding	`'none' \| 'sm' \| 'md' \| 'lg'`	'md'	Internal padding
onClick	`() => void`	—	Makes the card interactive with hover lift
children*	`ReactNode`	—	Card content
className	`string`	—	Additional Tailwind classes