oddkit
~/oddkit/tools/
// color, translated

Color Converter

Convert colors between HEX, RGB, HSL, and OKLCH, preview the result, and copy any value. Everything runs locally in your browser.

Accepts HEX, RGB(A), HSL(A), and OKLCH color values.

no server upload

HEX

#7c5cff

RGB

rgb(124 92 255)

HSL

hsl(252 100% 68%)

OKLCH

oklch(59.9% 0.23 286.2)

Browser-based color converter

Convert colors between HEX, RGB, HSL, and OKLCH while designing UI, writing CSS, or checking brand colors. Type or pick any supported format and see every equivalent value update instantly.

Colors are converted locally in your browser. No color values are uploaded to oddkit.

Common use cases

  • Translate design tool colors into CSS-ready values
  • Check alpha transparency across formats
  • Explore OKLCH values for modern, perceptually uniform color

Supported formats

Reads HEX (3/4/6/8 digit), rgb()/rgba(), hsl()/hsla(), and oklch() input, including alpha values, and outputs all four formats.

FAQ

Are my colors uploaded to oddkit?

No. Conversion runs locally in your browser.

Does it support alpha transparency?

Yes. HEX, RGB, HSL, and OKLCH all support an alpha channel, and it carries through every converted value.

What happens if I type an invalid color?

The tool shows a clear error message instead of crashing, so you can fix the input without losing your place.

Common conversions

HEX to RGB

Convert HEX color codes to rgb() for CSS, canvas, or design tools that expect RGB channels.

RGB to HEX

Convert rgb() or rgba() values to a HEX code for design handoff or hard-coding in CSS.

HEX to HSL

Convert HEX to hsl() to adjust hue, saturation, and lightness independently.

RGB to HSL

Convert rgb() to hsl() when you need to tweak lightness or saturation without changing hue.

HEX to OKLCH

Convert HEX to oklch() for perceptually uniform color adjustments in modern CSS.

HSL to OKLCH

Convert hsl() to oklch() to move from a legacy color space to a wide-gamut, perceptually uniform one.