Design System
Premium Design Tokens with OKLCH, Next.js 16.3.1 & Tailwind CSS v4
Buttons
Inputs & Forms
Semantic Colors
Success (✓ Solid/Double)
--status-success
Warning (! Dashed)
--status-warning
Error (× High-Contrast)
--status-error
Information (i Hairline)
--status-info
Badges & Dividers
Default
Secondary
Outline
Success
Warning
Error
Info
Horizontal Separator
Left
Middle
Right
Skeleton & Spinners
Skeleton Loading
Spinners & Progress
Alerts
Did you know?
All 41 Universal UI Primitives are now verified on Next.js 16.3.1.
Critical Notification
Action required to complete configuration.
Interactive Overlays & Accordion
Dialog / Modal
Accessible modal dialog with backdrop blur & ESC dismiss.
Dropdown Menu
Popover menu with click-outside detection.
Accordion
Accessible disclosure container.
Tabs
Organize content into different view contexts.
Manage your account settings and preferences.