Color Picker
Professional color exploration, accessibility, harmonies, scales and exports.
Live Preview
Explore color values, copy formats and fine-tune your palette.
Primary Color
HEX
RGB
HSL
Popular Colors
Quick presetsGenerate palettes, scales, gradients and design tokens instantly.
Click any shade to inspect and copy its values.
Selected Shade
HEX
#8B5CF6
RGB
rgb(139, 92, 246)
HSL
hsl(258, 90%, 66%)
Tailwind Usage
bg-primary-500
text-primary-500
border-primary-500
Explore professional color relationships and discover palettes that work together naturally.
Harmony
High contrast colors that sit opposite each other on the color wheel. Great for call-to-actions and emphasis.
Generated using this harmony.
Instantly see how your color performs against WCAG accessibility standards.
White Text Preview
Black Text Preview
White Text
Fail
Black Text
AA
Export your generated design system for development workflows.
--primary-50: #F8F5FE;
--primary-100: #EEE7FE;
--primary-200: #D6C5FC;
--primary-300: #B395F9;
--primary-400: #8756F6;
--primary-500: #8B5CF6;
--primary-600: #4B0CD9;
--primary-700: #3A09A9;
--primary-800: #2A0779;
--primary-900: #1E0557;
--primary-950: #110330;Quickly jump back to colors you've explored.
Color
#8B5CF6