How to use
- Pick a base color or paste a HEX value.
- Check RGB and HSL when you need design-system or graphics-friendly formats.
- Review quick contrast versus black and white before you place text on top.
Wave 40 breadth expansion
Review one color in multiple formats
The swatches below update together, so you can move between picker, HEX, RGB, and HSL without leaving the page.
How to choose between nearby pages
Use this page first when you want to browse a swatch and get one working HEX / RGB / HSL value quickly. Move to Color Mixer when two candidate swatches need a midpoint option. Move to Color Temperature Checker when one chosen swatch first needs a warm / cool / neutral direction check. Move to Color Palette Generator when one approved swatch now needs lighter, darker, or accent options around it. Move to Color Scale Generator when one approved swatch now needs a numbered light-to-dark scale for tokens or design systems. Move to Color Converter when the approved color must be shared in another notation, and move to Contrast Checker when the real question is pass/fail readability for a final foreground/background pair.
FAQ
What does this page do?
It lets you pick a color, convert it between HEX, RGB, and HSL, and check quick contrast ratios against black and white.
Does the share URL include a full palette?
No. The share URL keeps only the current HEX color. Derived RGB and HSL values are recalculated in the browser.
When should I use this page instead of a paint coverage page?
Use this page when the question is color selection, value conversion, or quick readability checks. Use paint coverage pages when you need liters, gallons, or can counts.
Are the contrast values enough for a full accessibility audit?
They are useful as a fast first check against black and white text, but a full accessibility review should also consider font size, weight, and the actual background context.