Everyday Utilities

Color Picker

Choose a color visually or paste a HEX code to see it converted instantly to every common web format — HEX, RGB and HSL — with a large live preview. Handy for matching brand colors, tweaking CSS or building palettes.

Preview
RGB rgb(74, 144, 217)
HSL hsl(210, 65%, 57%)

How to use

  1. Click the swatch to open your browser's native color picker, or type a HEX code directly.
  2. HEX, RGB and HSL values update together — edit any of them to convert both ways.
  3. Copy any format with one click.

Frequently asked questions

What is the difference between HEX, RGB and HSL?

They are three notations for the same color. HEX is compact and common in CSS (#4A90D9). RGB lists red/green/blue amounts. HSL expresses hue, saturation and lightness — easiest for humans to tweak.

Does it support transparency (alpha)?

The picker works with fully opaque colors. For transparency, add an alpha channel manually in CSS, e.g. rgba(74, 144, 217, 0.5) or 8-digit hex like #4A90D980.

Why do the same RGB values look different on other screens?

Screens have different brightness, contrast and color profiles. Values are exact, but physical rendering varies by device and calibration.