Color Converter
Colors in web development and design can be specified in different formats: HEX (#RRGGBB), RGB (Red, Green, Blue), and HSL (Hue, Saturation, Lightness). This tool instantly converts colors between all three formats with a visual preview.
Color Formats HEX is a compact hexadecimal format, most common in CSS. RGB defines color through three channel intensities (red, green, blue) from 0 to 255. HSL describes color through hue (0–360°), saturation, and lightness (0–100%), which is more intuitive when selecting harmonious color schemes and variations of a single hue.
Free online color converter between three major formats: HEX, RGB, and HSL. Use the built-in visual picker for convenient color selection or enter a value manually in any format — the others will update automatically. A large preview block shows the selected color in real time.
HEX (#RRGGBB) is a compact hexadecimal format, most common in CSS and web design. RGB (Red, Green, Blue) defines color through three channel intensities from 0 to 255. HSL (Hue, Saturation, Lightness) describes color through hue (0–360°), saturation, and lightness (0–100%), which is more intuitive for selecting harmonious color schemes.
Each value can be copied in a ready-to-use CSS format: hex, rgb(), or hsl(). An essential tool for web developers, designers, and anyone working with color in digital projects — from palette selection to style debugging.
How to use it
- Pick a colour in the visual picker or type a value in any format: HEX (#1e90ff), RGB (30, 144, 255) or HSL (210°, 100%, 56%).
- The other formats are recalculated automatically and the swatch shows the colour.
- Copy the value you need in ready CSS syntax: hex, rgb() or hsl().
When it helps
- Coding from a design: convert a Figma colour to HEX for CSS, or get HSL to make a lighter tint by changing lightness only.
- Design systems: describe a palette in HSL where colours of one family differ only in saturation and lightness.
- Print and brand books: verify that the website colour matches the brand values.
Frequently asked questions
When is HSL better than HEX?
When colours need to be adjusted deliberately: HSL gives a lighter or duller variant by changing one component, whereas in HEX all three channels would have to be recomputed.
What is the short HEX form?
#fff and #1af are shorthand for #ffffff and #11aaff: each digit is doubled. The converter understands both.
Is transparency supported?
Yes, enter an eight-digit HEX (#1e90ff80) or rgba/hsla — the alpha channel is kept in every format.