tigtools

Color Converter

Type or paste a colour in any supported format, or pick one, and every other format updates instantly.

Runs in your browser No sign-up

Read as HEX.

HEX
#336699
RGB
rgb(51, 102, 153)
HSL
hsl(210, 50%, 40%)
HWB
hwb(210 20% 40%)
OKLCH
oklch(49.93% 0.0987 250.43)
CMYK
cmyk(66.7%, 33.3%, 0%, 40%)

CMYK here is a simple formula, not colour-managed. For print, convert with the ICC profile your printer gives you.

How to use it

  1. Type or paste a colour, for example #1e90ff, rgb(30 144 255) or oklch(65% 0.18 250). You can also click the colour picker.
  2. Check the swatch to make sure it is the colour you expected.
  3. Copy the format you need from the list. Values with transparency keep their alpha.

How it works

Accepted inputs: HEX with 3, 4, 6 or 8 digits (the 4th and 8th digits are alpha), rgb() and rgba() with numbers or percentages, hsl() and hsla(), hwb(), oklch() and cmyk() with percentages or numbers from 0 to 100. Both the classic comma syntax and the modern space syntax with “/ alpha” work. Hue accepts deg, turn, rad and grad. Named colours such as “tomato” are not read; use the picker or a code instead.

All conversions go through sRGB. HSL and HWB are simple reshapings of the RGB values, so they convert exactly. OKLCH is a perceptual space: equal steps in its lightness look roughly equally different, which makes it useful for building palettes. It is computed with the published OKLab matrices. Some OKLCH colours are outside what sRGB can display; the tool says so and shows the nearest displayable colour.

CMYK is calculated with the common naive formula (K = 1 − the largest RGB channel). Real print output depends on paper, ink and the ICC profile, so treat these numbers as a starting point, not a print specification.

Examples

From a brand HEX code to CSS

A style guide gives #0b5d1e. Paste it to get rgb(11, 93, 30) for older CSS, hsl(133.9, 78.8%, 20.4%) to tweak lightness by hand, and an oklch() value for modern CSS colour functions.

Reading a colour with transparency

rgba(0, 0, 0, 0.5) converts to #00000080. The last two HEX digits (80) are the alpha: 128 out of 255, about 50 %.

Checking an OKLCH value from a design file

oklch(70% 0.4 150) is a very saturated green that sRGB screens cannot show. The tool flags it and gives the nearest sRGB colour, so you know the design will look different on most displays.

Frequently asked questions

Why does converting to HSL and back sometimes change the HEX by one?

HEX stores whole numbers from 0 to 255 per channel. Values in other formats are rounded for display (HSL to one decimal), and converting a rounded value back can land one step away. Copy the HEX if you need the exact original.

Is the CMYK value right for printing?

No, not on its own. It uses the simple formula without a colour profile. Printers use profiles such as FOGRA or GRACoL that give different numbers, so ask your printer or convert in a colour-managed application.

What is OKLCH and can I use it in CSS?

OKLCH describes a colour by perceived lightness, chroma (colourfulness) and hue. Current versions of the major browsers support oklch() in CSS. Keep a HEX or rgb() fallback if you support older browsers.

What does an 8-digit HEX code mean?

#RRGGBBAA: the last two digits are opacity, from 00 (fully transparent) to ff (fully opaque). The 4-digit form #RGBA works the same way with one digit per channel.

Privacy

Colours are converted in your browser. Nothing you enter is sent anywhere or stored.