Practical color tool
Color Converter: HEX, RGB, HSL and OKLCH
Convert colors between HEX, RGB, HSL and OKLCH formats and copy implementation-ready values for CSS and design docs.
What this page gives you
- Use the inspector on the home tool to see every format at once.
- Copy HEX, RGB, HSL, OKLCH or a CSS variable declaration.
- Use OKLCH when you want more perceptual control over shade scales.
Good for
- CSS implementation
- Design docs
- Token cleanup
How to use it
Palette generatorGenerate accessible color palettes, export CSS, Tailwind, SCSS, JSON, SVG and PNG palette assets, check WCAG contrast and extract colors from images locally.WCAG checkerCheck whether text and background colors meet WCAG AA and AAA contrast ratios. Free, instant, no upload required.Image extractorExtract a dominant color palette from PNG, JPG or WebP images. Processed locally in your browser — nothing uploaded.
Can I use this with the main generator?
Yes. Start from this page, then open the main Chromoforge tool with the same base color and export the palette.
Why does a value shift slightly after a round trip?
HEX and RGB store eight bits per channel, so every channel is quantised to one of 256 steps. OKLCH, HSL and LAB are continuous. Converting out and back rounds to the nearest representable byte, which can move a channel by one unit.
When is OKLCH a better choice than HSL?
Whenever perceived lightness matters. HSL lightness is a geometric value, so yellow at 50% looks far brighter than blue at 50%. OKLCH is perceptually uniform: equal lightness steps look equal across hues, which is what makes shade scales even.