Theme Mode Demo
This page demonstrates how our design system components look in both light and dark modes. You can toggle between modes using the theme switcher in the header.
Buttons
Button variants in current theme
Form Elements
Input elements in current theme
Alerts
Alert variants in current theme
Information
This is an informational alert.
Error
This is an error alert.
Badges
Badge variants in current theme
Default
Secondary
Outline
Destructive
Current Theme Settings
Information about the active theme
Active Theme: Loading...
Color Mode: System Preference
Contrast: Standard
Theme preferences are stored in local storage and will persist between visits.