100%

Picking Colors for the Web

Choosing the right colors is one of the trickiest parts of web design. This tool gives you a visual picker for solid colors and gradients, with real-time conversion between HEX, RGB, and HSL. Build a palette, save it, and export everything as CSS custom properties or SASS variables — ready to drop into your stylesheet.

Working with Color Formats

  • HEX (#3b82f6) — The most common format in CSS. Six hex digits representing red, green, blue
  • RGB (rgb(59, 130, 246)) — Useful when you need to control opacity with rgba()
  • HSL (hsl(217, 91%, 60%)) — Easier to reason about: hue is the color, saturation is intensity, lightness is brightness

Gradient Builder

CSS gradients let you blend between two or more colors. The gradient tab lets you visually build linear or radial gradients, adjust stops, and copy the CSS. If you need a specific color conversion, check the Color Converter.