Picsova

Color Converter

Pick a color and convert instantly between HEX, RGB, and HSL. Copy any format with one click: perfect for CSS and design work.

Runs entirely in your browser. Nothing is uploaded.

HEX

#8B5CF6

RGB

rgb(139, 92, 246)

HSL

hsl(258, 90%, 66%)

HEX ⇄ RGB ⇄ HSL with a picker

Every colour format is the same colour described differently, and each one is the convenient choice somewhere: HEX in a design handoff, RGB when you need an alpha channel, HSL when you want to lighten a shade without guessing new numbers. Pick a colour visually or type a value in any format, and the other two update immediately, ready to copy into a stylesheet.

How to convert HEX, RGB, and HSL

  1. 1

    Choose your colour

    Use the picker, or paste an existing HEX, RGB, or HSL value.

  2. 2

    Read the other formats

    HEX, RGB, and HSL all update live against a live preview swatch.

  3. 3

    Copy it into your CSS

    Each format has its own copy button.

Good to know

  • HSL is the format to reach for when building a colour scale: change only the lightness and you get a matching tint or shade.
  • HEX and RGB describe exactly the same value — `#3b82f6` and `rgb(59, 130, 246)` are interchangeable.
  • Three-digit HEX shorthand like `#f00` expands to `#ff0000`.
  • Everything is computed in the page, so the picker works offline once the page has loaded.

What people use it for

  • Converting a HEX value from a design file into RGB so you can add transparency
  • Building lighter and darker variants of a brand colour with HSL
  • Reading a colour out of existing CSS in the format you actually need

Frequently asked questions

Which formats can I convert between?+

HEX, RGB, and HSL. Pick a color or type a HEX value and copy any format with one click.

Can I paste a HEX code directly?+

Yes: type or paste a 3- or 6-digit HEX value and the RGB and HSL outputs update instantly.

Related tools

Color Palette Extractor

Pull dominant colors from an image

CSS Gradient Generator

Build & copy CSS gradients

Color Contrast Checker

WCAG AA & AAA pass or fail

Tints & Shades Generator

Build a colour scale from one hex

Or browse all 50 free tools.