Design Tokens

Core design elements including colors, typography, and spacing.

Colors

Primary
--primary#FF5500
Secondary
--secondary#F1F5F9
Destructive
--destructive#EF4444
Muted
--muted#F1F5F9
Accent
--accent#F1F5F9
Card
--card#FFFFFF

Semantic Colors

Success
Warning
Info

Typography

Heading 1

text-4xl font-bold

Heading 2

text-3xl font-semibold

Heading 3

text-2xl font-semibold

Body text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

text-base

Muted text. Used for secondary information.

text-sm text-muted-foreground

Border Radius

sm
md
lg
full