🎨 Color Converter
Convert colors instantly between HEX, RGB, and HSL formats with a live preview.
Pick a Color
Converted Values
How Color Conversion Works
Digital colors are commonly represented in three formats: HEX (a 6-digit hexadecimal code used in CSS/HTML), RGB (Red, Green, Blue channel values from 0–255), and HSL (Hue, Saturation, Lightness — often more intuitive for adjusting a color's shade).
HEX to RGB
Each HEX code splits into three 2-digit base-16 pairs — one each for Red, Green, and Blue — which are converted to base-10 (0–255).
RGB to HSL
Hue comes from which channel (R, G, or B) is highest and how the other two compare to it; Lightness is the average of the highest and lowest channel values; Saturation is derived from the spread between the highest and lowest channel relative to the Lightness.
Worked Example
Converting #2563EB: splitting into pairs gives Red = 25 (hex) = 37, Green = 63 (hex) = 99, Blue = EB (hex) = 235, so RGB(37, 99, 235). Running those values through the RGB-to-HSL formula gives HSL(221°, 83%, 53%).
Frequently Asked Questions
What is HSL good for?
HSL makes it easy to create lighter or darker variants of a color by adjusting only the Lightness value, without changing the Hue.
How is HEX related to RGB?
A HEX code is just RGB values written in base-16: the first two digits are Red, the middle two are Green, and the last two are Blue (00–FF, i.e. 0–255).
Why do RGB and HSL give different numbers for the same color?
They're just two different ways of describing the same color. RGB mixes three light intensities (Red, Green, Blue); HSL instead describes the color's position on a color wheel (Hue), how vivid it is (Saturation), and how light or dark it is (Lightness). Both describe the exact same pixel color.