ToolRecipe
Stays on this device No watermark Works offline

What do you need to get done?

Drop a file here

or .

/

Open an app

Follow a recipe

All recipes

Use one tool

All tools

HEX to HSL

Convert HEX to HSL online and for free. Enter a color and the tool shows it as HEX, RGB, HSL, HSV and CMYK at once, each with a copy button. It all runs in your browser.

How to convert HEX to HSL

  1. 1Type or paste your color, or choose it with the picker
  2. 2Find the HSL value in the list below the swatch
  3. 3Click the copy button next to it
  4. Your color as HSL, ready to paste.

How it works

  • Every format at once.You get HEX, RGB, HSL, HSV and CMYK for the same color, not just HSL.
  • Nothing is sent anywhere.The conversion is a bit of arithmetic in your browser.
  • No sign-up.Open the page, enter a color and copy the result.

What you can do

  • Type a color and see it as a swatch with every value next to it.
  • Pick a color with the color picker instead of typing, and the values update as you move.
  • Copy any value with one click, for example "HSL" for your CSS, design tool or print order.
  • Use short HEX codes such as #FC0, rgb() or hsl() notation, and CSS color names such as tomato.

Good to know

  • HEX writes a color as #RRGGBB: two hexadecimal digits each for red, green and blue, from 00 to FF. #FFC61A is red 255, green 198, blue 26.
  • HSL describes a color by hue (an angle from 0 to 360 degrees), saturation and lightness in percent. It makes lighter or duller shades easy to work out.
  • You can type HEX, rgb(), hsl(), hsv() or cmyk() values, or a CSS color name. HSV and CMYK take percentages, for example hsv(45, 90%, 100%) or cmyk(0%, 22%, 90%, 0%).
  • RGB values are whole numbers from 0 to 255. Percentages in HSL, HSV and CMYK are rounded to whole numbers.
  • CMYK is calculated with the plain formula from RGB. It uses no printer or color profile, so a print shop's proof can look different.

Questions

How do I convert HEX to HSL?

Enter your color in the field, or use the picker. The tool shows the HEX, RGB, HSL, HSV and CMYK values straight away, and each has a copy button.

Is my color sent to a server?

No. The conversion runs in your browser, on your own device. Nothing is sent to us or anyone else.

What color formats can I type in?

HEX such as #FFC61A, rgb(255, 198, 26), hsl(45, 100%, 55%) or a CSS color name. The results are shown in all five formats.

Why does the CMYK value differ from my printer's?

The tool uses the simple RGB to CMYK formula without a color profile. Printers apply their own profile, so use their values for print work.

Related tools

How it works

Small tools that run in your browser.

Four steps

  1. Start with a file or a task

    Drop a file, search, or pick a task.

  2. The tool opens in a window

    Open as many as you like, side by side as tabs.

  3. Results collect on the right

    Drag a result into the next tool.

  4. Save when you're done

    Saved files go to your downloads.

Who uses what

Tool sets for common jobs.

Put a tool on your home screen

The icon opens that tool, like an app.

iPhone and iPad

  1. Open the tool in Safari.
  2. Tap Share (the square with the arrow).
  3. Choose “Add to Home Screen”, then Add.

Android

  1. Open the tool in Chrome.
  2. Tap the menu (⋮) at the top right.
  3. Choose “Add to Home screen” or “Install app”.

Computer

  1. Open the tool in Chrome or Edge.
  2. Click the install icon in the address bar.
  3. Choose Install.

Skills

Claude skills we use ourselves, one job each.