Odin

Color Converter

Convert between HEX, RGB, and HSL with a live swatch.

About this tool

Design tools speak HEX; some APIs want RGB; CSS loves HSL. This free color converter translates between common color formats. Paste a HEX code, get RGB/HSL locally, and keep design tokens consistent across Figma and code.

How to use

  1. Enter a color in HEX, RGB, or HSL form.
  2. Convert to the other formats shown.
  3. Copy the value you need into CSS or a design token file.
  4. Adjust and reconvert if you tweak the shade.

Frequently asked questions

If alpha fields are present in the UI, yes. Otherwise convert opaque colors and add alpha in CSS separately.

Related tools