Color converter

How it works

1. 1

   Enter or pick a color

   Type any CSS color (#ff7f50, rgb(), hsl(), oklch() or a name like coral), or use the picker.

2. 2

   Copy any format

   Every notation updates together, ready to paste into CSS or a design tool.

3. 3

   Build a palette

   Tints and shades, plus complementary, analogous and triadic colors. Click any swatch to use it.

Questions

How do I convert HEX to RGB?

Split the six digits into pairs and read each as a hexadecimal number: #ff7f50 is ff = 255, 7f = 127, 50 = 80, so rgb(255 127 80). Paste it above to get every format at once.

What contrast ratio do I need?

WCAG asks for at least 4.5:1 for normal text (AA) and 3:1 for large text; 7:1 meets AAA. The ratios against white and black are shown for every color.

What is OKLCH?

A modern CSS color space where equal steps in lightness look equal to the eye, which makes it better than HSL for building consistent palettes.