Color Converter (HEX, RGB, HSL)
Convert colors between HEX, RGB, and HSL with a live preview.
About Color Converter (HEX, RGB, HSL)
Color Converter takes a HEX color value and shows it in HEX, RGB, and HSL — the three notations every modern stylesheet, design tool, and color picker speaks. Pick a color from the native color picker, or type a hex value (#RGB, #RGBA, #RRGGBB, or #RRGGBBAA); the RGB and HSL outputs update in real time, with a live swatch so you can see what the value actually looks like.
Worked example: enter #3b82f6 in the hex field and the converter returns rgb(59, 130, 246) and hsl(217, 91%, 60%). Alpha is shown when you give it: an 8-digit hex like #3b82f680 produces rgba(59, 130, 246, 0.5). Each output row has a copy button so the value lands in your clipboard in one click.
A note on scope. HEX is the input; RGB and HSL are read-only outputs. If you want to nudge a color by lightness or saturation, change the hex through the color picker (or by typing) and watch the HSL row follow. For perceptually uniform color work designers increasingly reach for OKLCH or LCH; this tool covers the three formats every browser, Tailwind / Bootstrap / Figma file, and design hand-off uses today. Named CSS colors (rebeccapurple, tomato) are not parsed — enter the corresponding hex.
All conversion happens in your browser. Color values are not exactly sensitive data, but nothing about your palette work is logged or uploaded.