color
Color Picker
pick a color, get hex/rgb/hsl + contrast.
- rgb
- 155, 107, 90
- hsl
- 16°, 27%, 48%
- vs white
- 4.52 · AA
- vs black
- 4.64 · AA
about
Pick any color and see its hex, RGB, and HSL values plus WCAG contrast ratios against black and white.
how to use
- Click the color swatch to open the native picker, or type a hex code.
- Read the RGB and HSL values.
- Check the WCAG contrast ratios against black and white.
examples
- Confirm a brand color hits AA contrast against your background.
- Convert a Photoshop HSL into the hex code you need for CSS.
- Eyeball complementary colors by tweaking hue.
faq
What do AA / AAA mean?
WCAG contrast grades. AA needs 4.5:1 for body text, 3:1 for large text. AAA needs 7:1 — gold standard.
Why two contrast readings?
So you can see at a glance whether to use black or white text on that background.