/dev/tokens

Design Tokens — Seed

Figma-Extraktion ausstehend

Interimsweise Token-Palette. Finale Werte kommen aus Figma (Task 3.1, blockiert bis UX-Mockup-Delivery). Theme-Toggle im Topbar probiert.

Brand

Primär-Skala für Sidebar, Accents, Buttons

brand-50
--color-brand-50
brand-100
--color-brand-100
brand-200
--color-brand-200
brand-300
--color-brand-300
brand-400
--color-brand-400
brand-500
--color-brand-500
brand-600
--color-brand-600
brand-700
--color-brand-700
brand-800
--color-brand-800
brand-900
--color-brand-900

Semantic

Surface, Border, Text — themable (light/dark)

surface
--color-surface
surface-muted
--color-surface-muted
surface-subtle
--color-surface-subtle
border
--color-border
border-muted
--color-border-muted
text-primary
--color-text-primary
text-secondary
--color-text-secondary
text-muted
--color-text-muted

Status

Feedback-Farben für Inline-States

success-500
--color-success-500
warning-500
--color-warning-500
danger-500
--color-danger-500
info-500
--color-info-500
accent-500
--color-accent-500

Spacing

Tailwind spacing-Skala (seed)

1
0.25rem
2
0.5rem
3
0.75rem
4
1rem
6
1.5rem
8
2rem
12
3rem
16
4rem

Radius

Border-Radius-Tokens

sm
md
lg
xl
2xl
full

Shadows

Elevation-Stufen

sm
md
lg
xl

Typography

Geist Sans — Size-Ramp

xsSchneller brauner Fuchs
smSchneller brauner Fuchs
baseSchneller brauner Fuchs
lgSchneller brauner Fuchs
xlSchneller brauner Fuchs
2xlSchneller brauner Fuchs
3xlSchneller brauner Fuchs
4xlSchneller brauner Fuchs