Skip to main content
chain
Color Converter
HEX
RGB
HSL
Enter a colour to see it in every format
// about this tool

Color Converter Online

Updated 2026-08-19

Convert colours between HEX, RGB, and HSL online for free. Paste any colour value and SnapTools instantly shows every other format alongside a live preview swatch, with one-click copy. Everything runs in your browser, so nothing is uploaded.

Designers hand off HEX, CSS authors often prefer RGB or HSL, and building colour scales is far easier in HSL. This converter bridges all three so you can move a colour between your design tool, stylesheet, and code without reaching for a calculator.

// how to use

  1. 1 Enter a colour in any format — HEX (#7C6AFF), RGB (rgb(124,106,255)), HSL (hsl(248,100%,71%)), or a CSS named colour (crimson, rebeccapurple).
  2. 2 SnapTools shows the colour in every other format, with a live preview swatch.
  3. 3 Click Copy on the format you need for your CSS, design tool, or code.

// examples

HEX to RGB and HSL
Input
#7C6AFF
Output
rgb(124, 106, 255) · hsl(248, 100%, 71%)
RGB to HEX
Input
rgb(255, 0, 0)
Output
#FF0000
HSL to RGB
Input
hsl(0, 100%, 50%)
Output
rgb(255, 0, 0)

// common uses

Translating design HEX values into CSS RGB or HSL Matching colours between Figma, CSS, and code Building HSL-based colour scales Checking the exact RGB channels of a HEX value

// faq

Which colour formats are supported?
HEX (3- or 6-digit, with or without the
How is HEX shorthand handled?
Three-digit shorthand like
Are the conversions accurate?
Yes. RGB and HEX map exactly, and HSL is computed with the standard formula. Rounding to whole numbers may cause a one-unit difference on a perfect round-trip, which is expected.
Why is my colour rejected?
Values must be in range — RGB channels are 0–255 and HSL uses 0–360 for hue and 0–100% for saturation and lightness. Anything outside that, or an unrecognised format, is flagged as invalid.
Is my input uploaded?
No — the conversion runs in your browser, so nothing leaves your machine.

Use this via API

Get a free API key →
curl -X POST https://thesnaptools.com/api/v1/tools/color-converter \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"color":"#7C6AFF"}'