UI Component Showcase
Modern, accessible, and responsive components
Buttons
Variants
Sizes
States
Cards
Default Card
A simple card with hover effect and default styling.
Elevated Card
A card with shadow elevation for emphasis.
Outlined Card
A card with a border outline style.
Glass Card
A card with glassmorphism effect.
Modal
Click the button below to open a modal dialog with accessibility features.
Animations
Fade In
animate-fade-in
Scale In
animate-scale-in
Hover Lift
hover-lift
Color Palette
Primary
50
100
200
300
400
500
600
700
800
900
Accent
50
100
200
300
400
500
600
700
800
900