How to use
- Start with the color format you already have: HEX, RGB, HSL, OKLCH, or OKLab.
- Convert to the perceptual values you need for design tokens or system handoff.
- If clipping appears, keep the warning in mind before reusing the result in CSS or a design system.
Wave 51 expansion
Move from common color conversion to perceptual editing space
This page sits after Color Converter and Color Difference. It helps when a chosen color now needs OKLCH or OKLab values for token work or perceptual tuning.
How to choose between nearby pages
Use Color Picker when the color is still undecided. Use Color Converter when common formats alone are enough. Use Color Difference when the job is comparing two candidates. Use this page after one color is already approved and you need OKLCH or OKLab values for perceptual editing, token work, or handoff. Move to CSS Color Mix when two approved colors now need a ready-to-paste color-mix() expression, to Color Token Export when the remaining job is packaging approved roles for code, or to Color Scale or Contrast Checker once those values have already been reviewed.
FAQ
What does this page do?
It converts one color between HEX, RGB, HSL, OKLCH, and OKLab so you can inspect perceptual color values alongside common formats.
When should I use this instead of Color Converter?
Use Color Converter for common HEX, RGB, HSL, and keyword work. Use this page when the job specifically needs OKLCH or OKLab values for perceptual editing or modern design-token workflows.
Why might the page mention sRGB clipping?
Some OKLCH or OKLab combinations sit outside the visible sRGB range used by most browsers. In those cases the page shows the nearest displayable sRGB value and warns that clipping happened.
What is stored in the share URL?
Only the normalized HEX color is stored in the share URL. The other formats are recalculated in the browser.