How to use the color picker

1. Click the color box or drag the R, G, B sliders to mix a color.
2. Type or paste a HEX code (like #2563EB) to jump to an exact color.
3. Copy the HEX, RGB, HSL, or CSS variable value with one click.
4. Or grab a starting point from the popular colors row.

Which format should you use?

• HEX (#2563EB) — the standard for web design and most design tools.
• RGB (rgb(37, 99, 235)) — handy when you need opacity, as rgba().
• HSL (hsl(221, 83%, 53%)) — intuitive for creating shades: keep hue, adjust lightness.

Example

Type #22C55E and you get rgb(34, 197, 94) — a fresh green often used for success buttons and badges.

Frequently asked questions

Is it free? Yes, unlimited use with no account.
Can I use it for print design? Screen colors are RGB-based; convert to CMYK in your design software for print.
Does it save my colors? No — nothing is stored; copy the values you need.