Color Converter
Convert a colour between HEX, RGB and HSL, with a live preview — all in your browser.
— — — How it works
Type a colour in any common form — a HEX code like #2A6F97, an rgb() or hsl() value, or even a CSS colour name like teal — or use the colour picker, and the tool instantly shows the equivalent HEX, RGB and HSL values along with a live swatch. It works by asking your browser's own rendering engine to interpret the colour, so anything your browser understands is accepted, and the conversions are always accurate. Everything runs locally; nothing is sent anywhere.
HEX, RGB and HSL explained
HEX is the six-digit code used throughout web design (#RRGGBB), compact and easy to paste into CSS or design tools. RGB expresses the same colour as red, green and blue values from 0 to 255, which is handy when a tool asks for channels separately. HSL describes a colour by hue (its position on the colour wheel), saturation and lightness, which makes it intuitive to tweak — nudge the lightness to get a tint or shade of the same hue. Being able to move between all three lets you match a colour across design software, code and content tools.
Typical uses
Colour conversion is a daily task for designers and developers: turning a brand HEX code into RGB for a document, grabbing the HSL of a colour to build a consistent palette, or copying a value from a mock-up into CSS. The live preview helps you confirm you have the exact shade before you commit it, and the copy buttons drop the value straight onto your clipboard in the format you need.
Frequently asked questions
Which colour formats can I paste in?
HEX (3 or 6 digits), rgb(), hsl() and standard CSS colour names all work, because the browser itself parses them.
Does it support transparency (alpha)?
The converter focuses on the solid colour. Alpha isn't shown in the outputs, so an rgba() value is converted using its RGB channels.
Is my data sent anywhere?
No. All parsing and conversion happen in your browser and nothing you enter leaves your device.