Color converter

Convert between HEX, RGB, HSL and CMYK.

🔒 This file is processed in your browser. It is never uploaded anywhere.

What it is for

The same colour is written differently depending on where it will be used, and this tool translates between all of them. HEX is the six-character code common on the web, RGB expresses colour as a mix of red, green and blue, HSL describes it by hue, saturation and lightness, and CMYK is the printing system.

Conversion is needed daily because every program speaks its own dialect. The designer hands over a HEX, the layout tool asks for RGB, the printer works in CMYK and the stylesheet accepts any of the three. Translating by hand is possible but tedious and error-prone.

HSL deserves a special mention because it is the most intuitive for adjusting a colour by eye. Keeping the hue and raising the lightness gives a lighter variant of the same colour, something far harder to achieve by nudging three RGB numbers.

How it works

  1. Pick a color with the visual picker or type its HEX code directly.
  2. The tool instantly calculates its RGB, HSL and CMYK equivalents.
  3. Copy the format you need for your design or your code.

When to use it

From design to code

Converting a mockup’s colours to HEX or RGB is the mandatory step to get them into the stylesheet.

Preparing for print

Screen colours are defined in RGB, but printing works in CMYK. The conversion gives you the starting point.

Creating variants

Adjusting lightness in HSL produces light and dark versions of a brand colour without losing the hue.

Practical tips

  • The CMYK conversion is the standard mathematical formula. For professional printing, the printer may request a specific colour profile giving slightly different values.
  • Not every screen colour can be printed: heavily saturated greens and blues always come out duller on paper.
  • Store your project colours in HEX, the most portable format between tools.
  • Before settling on a colour for text, check its contrast against the intended background.

Frequently asked questions

Why do I need several color formats?

Each context uses a different one: CSS typically uses HEX or RGB, print design uses CMYK, and HSL is more intuitive for adjusting hue and lightness by hand.

Is the CMYK conversion exact?

It's a standard mathematical RGB→CMYK conversion; for professional printing, your print shop may require a specific, different color profile.

Related tools