Free online color picker
Pick any colour and instantly get its HEX, RGB and HSL values, matching shades and tints, and a WCAG contrast rating. Everything runs in your browser — perfect for designers and developers building palettes and checking accessibility.
How to use the color picker
- Pick a colour with the picker or type a HEX value.
- Read the HEX, RGB and HSL values — click any to copy.
- Browse the auto-generated shades and tints.
- Check the WCAG contrast rating for text on that colour.
HEX vs RGB vs HSL
HEX (#RRGGBB) is common in design tools, RGB is easy in code, and HSL (hue/saturation/lightness) is best for creating consistent shades. Having all three at once saves constant conversion.
Accessibility
For readable text, aim for a contrast ratio of at least 4.5:1 (WCAG AA) for normal text and 3:1 for large text. The built-in checker tells you instantly whether a pairing passes.