Loading...
Complete color palette, gradients, animations, and theme utilities
Primary
--koda-primary
hsl(244, 63%, 62%)
Primary Dark
--koda-primary-dark
hsl(244, 58%, 58%)
Secondary
--koda-secondary
hsl(158, 64%, 40%)
Accent
--koda-accent
hsl(270, 37%, 46%)
Background
--koda-background
hsl(222, 47%, 11%)
Surface
--koda-surface
hsl(215, 25%, 17%)
Border
--koda-border
hsl(215, 25%, 25%)
Text
--koda-text
hsl(213, 27%, 84%)
Text Muted
--koda-text-muted
hsl(215, 20%, 65%)
Success
--koda-green-500
hsl(145, 69%, 45%)
Warning
--koda-yellow-500
hsl(45, 93%, 47%)
Error
--koda-red-500
hsl(0, 84%, 60%)
Info
--koda-blue-500
hsl(221, 92%, 60%)
Primary Gradient
--koda-gradient
Secondary Gradient
--koda-gradient-2
Body text - Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Small text - Sed do eiusmod tempor incididunt ut labore et dolore magna.
Extra small text - Ut enim ad minim veniam.
Fast
150ms
Normal
300ms
Slow
500ms
Slower
800ms
Small
--koda-shadow-sm
Medium
--koda-shadow-md
Large
--koda-shadow-lg
Extra Large
--koda-shadow-xl
Glow
--koda-shadow-glow