Color Converter

Enter any colour and see it in every format at once, with a live swatch and contrast figures.

Colour
All formats
Runs locally in your browser

About the Color Converter

Colours travel between formats constantly: a designer hands over a HEX, CSS wants RGB or HSL, a print job needs CMYK, a mobile app wants a platform-specific literal. This converter takes a colour in any common notation, HEX, RGB, HSL, HSV, CMYK, or a CSS name, and shows it in all of them at once, alongside a swatch so you can confirm it is the colour you meant.

It also gives the values you rarely have to hand: LAB and XYZ for colour science, the decimal integer, the nearest CSS colour name, and ready-to-paste literals for Android, Swift/UIKit and Flutter. The contrast ratios against black and white, and the relative luminance, help you judge readability at a glance; the Contrast Checker tests a specific pair against WCAG.

Everything is computed locally. For a single target format, the dedicated pair converters such as HEX to RGB are simpler; for building a palette, the Palette Generator.

How to use

  1. Enter a colour in any format, or a CSS name.
  2. Read every format and the swatch.
  3. Copy the line you need.

Common questions

What input formats are accepted?
HEX (3, 4, 6 or 8 digit), rgb() and rgba(), hsl() and hsla(), hsv(), cmyk(), a bare "r, g, b" triple, and CSS colour names.
What are the LAB and XYZ values for?
They are perceptual and device colour spaces used in colour science and for measuring colour difference.
How is contrast shown?
As the ratio against pure black and pure white. Use the Contrast Checker to test a specific foreground and background.