Color Converter (HEX, RGB, HSL)
Convert a HEX color to RGB and HSL instantly.
Enter a HEX color code and get its RGB and HSL equivalents at once. Perfect for web design and CSS — paste a hex like #4F46E5 and copy the rgb() or hsl() value you need. Works with 3- or 6-digit hex.
Formula / method
Examples
rgb(79, 70, 229)
rgb(255, 255, 255)
HEX, RGB and HSL explained
Web colors are written three main ways. HEX is a six-digit code like #4F46E5, compact and common in CSS. RGB lists red, green and blue channels from 0 to 255. HSL describes hue, saturation and lightness, which is easier to reason about when you want a lighter or more muted version of a color.
Converting between them
This tool takes a color in one format and shows the equivalent in the others, so you can copy whichever your tool or stylesheet expects. Because HSL separates lightness from hue, it is often the easiest starting point for building an accessible palette — check pairs with the Color Contrast Checker.
Where it's used
- Copying a CSS color as HEX, rgb() or hsl() depending on what your stylesheet needs
- Converting a designer's hex code into RGB channels for a graphics tool
- Getting HSL values to make a lighter or more muted shade of a color
- Matching brand colors across design tools and code
- Building an accessible palette, then checking pairs with a contrast checker
Real-world examples
- #4F46E5 converts to rgb(79, 70, 229) and hsl(244, 76%, 59%).
- #fff expands to rgb(255, 255, 255) — pure white.
- A 3-digit hex like #f00 expands to #FF0000, or rgb(255, 0, 0).
A bit of history
The HSL and HSV color models were introduced by computer-graphics pioneer Alvy Ray Smith in a 1978 paper, "Color Gamut Transform Pairs," as a more intuitive alternative to RGB for artists picking colors.
Did you know?
HSL was designed so that changing one number — lightness or saturation — lets you make a color lighter or more muted without juggling red, green and blue values, which is why designers often reach for it.
FAQ
What is the difference between RGB and HSL?
RGB mixes red, green and blue light. HSL describes a color by hue (the color), saturation (how vivid) and lightness — often easier to tweak by hand.