Pick colors and convert between HEX, RGB, HSL, OKLCH, and CMYK.
Click the hexagon to open picker
HEX#3B82F6
RGBrgb(59, 130, 246)
HSLhsl(217, 91%, 60%)
OKLCHoklch(0.600 0.364 217)
CMYKcmyk(76%, 47%, 0%, 4%)
WCAG Contrast Ratio
White3.68:1
✗ Normal (AA)✓ Large (AA)✗ Strict (AAA)
Black5.71:1
✓ Normal (AA)✓ Large (AA)✗ Strict (AAA)
Custom Contrast Test
Ratio3.68:1
The quick brown fox
jumps over the lazy dog.
✗ Normal (AA)✓ Large (AA)✗ Strict (AAA)
Tints & Shades
Click a shade to select it, then save to palette
Saved Palette
No colors saved yet
Color Harmonies
Complementary
Analogous
Triadic
Split-Complementary
Tetradic
How it Works
The Normal, Large, and Strict badges correspond to official **Web Content Accessibility Guidelines (WCAG) 2.1** color recommendations.
**Normal (AA)** tests standard text. It passes if the foreground/background color combo has a contrast ratio of at least 4.5:1.
**Large (AA)** tests larger text elements (headers). It has a lower bar, passing if the contrast ratio hits at least 3.0:1.
**Strict (AAA)** is the highest tier of accessibility compliance for standard text. This ensures maximum legibility, requiring a stiff contrast ratio of 7.0:1 or more.