OpenTools
Design

Colour Converter

Convert HEX, RGB, HSL and named colours to other formats, including CMYK, with a colour picker and text contrast detection.

Colour Converter
Convert between colour formats with a simple interface

Supported Colour Formats

HEX
Examples: #FF5733, #f53, FF5733
RGB(A)
Examples: rgb(255, 87, 51), rgba(255, 87, 51, 0.5)
HSL(A)
Examples: hsl(9, 100%, 60%), hsla(9, 100%, 60%, 0.8)
CMYK
Examples: cmyk(0, 100, 80, 0)
Display P3
Examples: color(display-p3 0.478 0.315 0.686)
LCH
Examples: lch(60.22 52.34 240.01)

About this tool

Easily convert HEX, RGB(A), HSL(A), and named colours into other formats, including CMYK. The tool features a colour picker for visual selection, handles various input formats with lenient parsing, provides colour names, and recommends the best text colour (black or white) for contrast. Perfect for designers and developers working with colour schemes and CSS. Online color converter works in any browser for web design, UI/UX design, and CSS development.

How to use the Colour Converter

  1. Type a colour into Enter Colour as HEX, RGB, HSL or a name like tomato, or pick one with the Colour Picker.
  2. Read the matching values under Colour Formats, including CMYK and Display P3.
  3. Click the copy icon beside any format to put it on your clipboard.
  4. Check Best Text Colour to see whether black or white text reads better on that colour.

Give us your feedback

Help us improve Colour Converter!

Frequently asked questions

How do I convert HEX to RGB?

A HEX code is three pairs of hexadecimal digits for red, green and blue, so #FF5733 means red 255, green 87 and blue 51. Paste the code into Enter Colour and the RGB value appears straight away, ready to copy.

Can I convert CMYK to HEX?

Not at the moment. The converter reads HEX, RGB(A), HSL(A) and CSS colour names, and shows CMYK as an output. That CMYK value is a straight mathematical conversion rather than a printer profile, so ask your printer for exact print colours.

How does it choose black or white text?

It works out the relative luminance of your colour with the WCAG formula. Lighter colours get black text and darker ones get white, which keeps labels on buttons, badges and banners readable.

Does it handle transparency?

Yes. Enter an rgba() or hsla() value with an alpha, or an 8-digit HEX code, and the alpha carries through to the HEX, RGBA and HSLA results so you can paste them straight into CSS.

Where does the conversion happen?

Right in your browser. The maths runs on the page as you type, so results appear instantly and there is nothing to install or sign up for.

Colour Converter screenshot

Related tools