Skip to content
Tools on Deck

Color Converter & Picker

Convert HEX, RGB, HSL, CMYK and OKLCH.

Processed locallyFreeNo sign-up

Color Converter tool

About this tool

A color converter translates a color among HEX, RGB, HSL, HSV, CMYK, and OKLCH values. Paste any CSS color, including a named value such as tomato, or choose visually with the picker. The page also creates tints and shades and reports WCAG contrast ratios against both white and black.

Conversion runs in your browser, so the color values are never uploaded and disappear when the tab closes. Chrome and Edge users can sample a screen color with the supported eyedropper. CMYK output is a simple mathematical conversion for reference; it is not tied to an ink, paper, printer, or managed print profile.

How to use the Color Converter

  1. 1Enter a CSS color name, function, or hexadecimal value.
  2. 2Use the eyedropper in a supporting browser if you prefer sampling.
  3. 3Read the HEX, RGB, HSL, HSV, CMYK, and OKLCH equivalents.
  4. 4Compare WCAG contrast ratios against white and black backgrounds.
  5. 5Copy a converted value or select a generated tint or shade.

Features

Six color models

View HEX, RGB, HSL, HSV, CMYK, and OKLCH representations together.

CSS name parsing

Accept browser color syntax and familiar named colors such as tomato as input.

Supported screen eyedropper

Sample a displayed color directly in browsers such as Chrome and Edge.

Dual contrast ratios

Check WCAG contrast measurements for the selected color against white and black.

Tint shade palette

Generate lighter tints and darker shades from the current color for comparison.

Frequently asked questions

Can I enter a CSS color name instead of HEX?

Yes. Any CSS color the browser understands can be used, including names such as tomato and supported functional notation.

Is the CMYK conversion ready for professional printing?

No. It is a simple mathematical conversion and does not represent a specific printer, paper, ink set, or color profile.

Why can I not see the color eyedropper?

The eyedropper depends on browser support. It is available in browsers such as Chrome and Edge, but not in every browser.

What do the white and black contrast numbers mean?

They are WCAG contrast ratios comparing your current color with white and black backgrounds. Larger ratios indicate greater luminance contrast.

Are sampled screen colors uploaded?

No. Sampling and all model calculations stay in the browser, and the site keeps no color history after the tab closes.