Color Picker
Pick any color and get its HEX, RGB, HSL, and CMYK codes instantly. Build palettes from color theory, check WCAG contrast, and copy everything with one click — free, in your browser.
#ff7a30255, 122, 4821°, 100%, 59%0%, 52%, 81%, 0%Palette from this color (click to use)
Contrast checker (WCAG)
Everything runs in your browser. Colors you pick are never sent or stored anywhere.
What the picker gives you
Choose a color with the native picker or type a hex code, and all four code formats update at once: HEX for CSS and design tools, RGB for screens, HSL for humans who think in hue and lightness, and CMYK as a print approximation. Each row has its own copy button because retyping color codes is how typos are born.
The palette row applies classic color-theory relationships to whatever color you picked — its complement, two analogous neighbors, and two triadic partners. Click any swatch to jump to it and build from there. Recent colors stick around until you close the tab.
The contrast checker matters more than it looks
Pick a text color and a background, and the tool computes the exact WCAG contrast ratio. 4.5:1 is the accessibility standard for body text; 7:1 passes the stricter AAA level. Low-contrast text is the single most common accessibility failure on the web — and since 2025, accessibility rules like the European Accessibility Act have real legal teeth. Thirty seconds here saves an audit finding later.
A note on CMYK
Screen colors (RGB) can display shades that ink physically cannot reproduce. Our CMYK values use the standard conversion formula, which is what design software shows by default — but the definitive print color always comes from your printer’s color profile. Treat the CMYK here as a close starting point, not a contract with the print shop.
Frequently asked questions
Why do HEX and RGB describe the same color?
They are the same numbers in different clothing. HEX is the RGB values written in base-16 — #ff7a30 means red 255, green 122, blue 48. Every HEX code has exactly one RGB equivalent and vice versa.
What contrast ratio do I need for accessible text?
WCAG requires 4.5:1 for normal body text and 3:1 for large text (roughly 24px and up). The stricter AAA level asks for 7:1. The checker on this page shows your exact ratio and which levels it passes.
Are the colors I pick stored anywhere?
No. Everything is computed in your browser. The recent-colors row lives only in the open tab and disappears when you close it.