Color Code Converter
Convert colors between HEX, RGB, and HSL.
How to use the Color Code Converter
Enter your values and pick a mode if the tool offers one.
Click calculate — results appear instantly, computed in your browser.
Copy the result or save the tool to your favorites.
Frequently asked questions
A hex color like #3b82f6 or 3b82f6.
The equivalent RGB and HSL values.
This version handles solid colors.
Six-digit hex is recommended; three-digit shorthand also works.
Entirely in your browser. Your data is never uploaded to a server.
About the Color Code Converter
This tool converts a colour between the three formats used most in web and graphic design: HEX, RGB, and HSL. Enter a hex code such as #3b82f6 and instantly see its RGB and HSL equivalents, along with a live preview swatch of the colour itself.
The three colour formats
HEX writes a colour as a six-digit hexadecimal code, two digits each for red, green, and blue. RGB expresses the same three channels as decimal numbers from 0 to 255, which many people find more intuitive. HSL takes a different approach, describing a colour by its hue (its position on the colour wheel from 0 to 360 degrees), its saturation (how vivid it is), and its lightness (how bright). All three describe the same visible colours; they are just different coordinate systems for the same space.
Why each format is useful
HEX is compact and dominant in HTML and CSS, which is why it is everywhere on the web. RGB maps directly to how screens actually emit light, mixing red, green, and blue, and is handy when adjusting individual channels. HSL is the most human-friendly for designing: because hue, saturation, and lightness are separated, you can take a colour and easily make it lighter, more muted, or shift it around the wheel without guesswork. Designers often pick a colour in HSL precisely because creating harmonious variations is so much easier there.
How the conversion works
Converting HEX to RGB simply reads each pair of hex digits as a number from 0 to 255. Converting RGB to HSL involves finding the maximum and minimum channel values to derive lightness, then computing saturation and the hue angle from their relationships. The maths is well defined, so the conversions are exact, and seeing all three side by side helps you understand how a colour is constructed.
Common uses
Web developers convert between formats when a design tool gives one format but their code needs another. Designers use it to build palettes, find accessible contrast, and create tints and shades. Anyone matching a brand colour across tools that speak different formats will reach for a converter like this regularly.
Tips and related tools
The tool accepts hex codes with or without the leading hash, and supports both three-digit shorthand and full six-digit codes. The live swatch lets you confirm visually that you have the colour you intended. For a quick one-way HEX to RGB conversion see the HEX to RGB Converter, and to check colours for accessibility the Color Blindness Simulator. Everything runs in your browser.