Color Converter
Convert between HEX, RGB, HSL, and OKLCH color formats. Live preview.
Accepts HEX, RGB, HSL, and OKLCH
Three steps to done
Drag and drop or click to browse
Runs in your browser, nothing uploaded
Get your file instantly
When to use this
Design tokens
Convert brand colors to every format used across design tools, CSS, and native apps.
CSS color functions
Get OKLCH values ready to paste into modern CSS for perceptually uniform palettes.
Cross-tool compatibility
Quickly translate colors between Figma (HEX), Tailwind (HSL), and browser DevTools (RGB).
Color format converter: HEX, RGB, HSL, OKLCH
Type or paste any color value and see it converted to all other formats instantly. Accepts HEX codes like #ff6600, RGB values like rgb(255, 102, 0), HSL like hsl(24, 100%, 50%), and modern OKLCH like oklch(0.7 0.15 50).
OKLCH support is included because it is increasingly used in modern CSS design systems. Unlike HSL, OKLCH is perceptually uniform, meaning a 10-unit lightness step always looks the same regardless of hue. This makes it better for programmatic palette generation.
Each result has a one-click copy button. All conversions run entirely in your browser with no server calls.
Frequently Asked Questions
Related tools
All toolsCompress Image
Reduce image file size without losing quality. Supports PNG, JPG, and WEBP.
HEIC to JPG
Convert iPhone HEIC photos to JPG format instantly in your browser.
Resize Image
Resize images to exact dimensions with presets for Instagram, LinkedIn, YouTube, and more.
JPG to PNG
Convert JPG images to PNG format with transparency support.
3 free uses left today
Unlimited with Pro