Skip to content

Color Converter

Use the all-formats workspace when the job matters more than the starting notation. Paste one color, inspect screen and unprofiled print approximations, build code snippets and states, and carry the same local workspace into any exact converter.

Synchronized color

#6366F1

Parsed as RGB; malformed or out-of-range channels are rejected, never silently clamped.

Integer or percentage RGB, modern or legacy CSS, Hex with optional alpha, HSL, HSV, OKLCH, LAB, LCH, CMYK, or a CSS name.

100%

Adjust channels

99
102
241

Share this exact input

?color=6366F1

One input, implementation-ready output

Color workspace

Hex

#RRGGBB

#6366F1

CSS RGB

Modern space syntax

rgb(99 102 241)

Legacy RGB

Comma syntax

rgb(99, 102, 241)

RGB %

Percentage channels

rgb(38.8% 40% 94.5%)

HSL

CSS hue, saturation, lightness

hsl(239 84% 67%)

HSV / HSB

Design-tool model

hsv(239, 59%, 95%)

OKLCH

Perceptual CSS color

oklch(58.5% 0.204 277.1)

LAB

CSS Lab, D50

lab(49.05% 30.34 -71.87)

LCH

CSS LCH, D50

lch(49.05% 78.02 292.89)

CMYK

Unprofiled approximation

cmyk(59%, 58%, 0%, 5%)

How to Use the Color Converter

Paste a color value such as #FF5733, rgb(255, 87, 51), hsl(11, 100%, 60%), or three RGB numbers. The preview updates immediately and the output panel shows every supported format with copy buttons. You can also use the sliders to fine tune the color and share the exact value with a URL.

Choosing Between Hex, RGB, HSL, and CMYK

Hex, RGB, and HSL describe screen colors. Hex is concise, RGB exposes the red, green, and blue channels used by displays, and HSL describes hue, saturation, and lightness in a way that is easier to adjust by eye. CMYK describes ink percentages for print and is best treated as a production starting point rather than a guaranteed printed result.

Common Use Cases

Designers use color conversion when moving colors between Figma, CSS, image editors, and print specifications. Developers use it when building theme tokens, hover states, charts, and accessible interface palettes. Marketing teams use it to translate brand colors into the formats requested by different vendors.

Frequently Asked Questions about Color Converter

You can enter hex codes, rgb() values, hsl() values, or simple RGB number triplets. The tool displays Hex, RGB, HSL, and CMYK output together so you do not need to switch pages for common web and print formats.