HEX to RGB converts colour codes between the formats used in web design and development: HEX (#2563eb), RGB (rgb(37, 99, 235)) and HSL (hsl(221, 83%, 53%)). Designers often get a HEX code from a brand guide, while code, design apps or CSS animations may need RGB or HSL.
Type a value in any field, or use the colour picker, and the other formats update instantly together with a large preview swatch. Each value can be copied in valid CSS syntax.
How to use the HEX to RGB Color Converter tool
- Enter a HEX, RGB or HSL value, or pick a colour.
- The other formats update automatically.
- Check the preview swatch.
- Click a Copy button to copy the CSS value.
Features
- Two-way conversion between HEX, RGB and HSL.
- Supports 3-digit shorthand HEX (#fff).
- Built-in colour picker.
- Copy-ready CSS syntax.
- Instant and works offline.
Tips for best results
HSL is the most intuitive format for creating colour variations. Keep the hue the same and change the lightness to get lighter or darker shades of a brand colour. For accessible text, make sure there is enough contrast against the background: WCAG recommends a ratio of at least 4.5:1 for normal text.
Each colour format has its place: HEX is short and common in CSS and design handoffs, RGB maps directly to how screens mix red, green and blue light, and HSL makes it easy to create palettes by adjusting lightness and saturation. Being able to switch between them quickly saves time when moving between design tools and code.
Compatibility and limits
The HEX to RGB Color Converter tool is built for developers, testers, students and anyone who handles data. It runs in every modern browser, needs no installation or extension, and keeps working offline once the page has loaded. Because nothing is sent to a server, it's safe to use with production data, access tokens and internal configuration files.
Privacy: your files never leave your device
The data you enter is processed entirely in your browser with JavaScript. Nothing is sent to a server, which makes the tool safe for API responses, tokens, configuration files and other sensitive developer data.
Frequently asked questions
How do I convert HEX to RGB?
Split the 6-digit code into three pairs and convert each pair from hexadecimal to decimal. #2563eb becomes 37, 99, 235. This tool does it instantly.
What is HSL?
Hue (0–360°), Saturation (%) and Lightness (%), a colour model that's easier for people to adjust than RGB.
Does it support transparency (alpha)?
This converter handles solid colours. Add alpha in CSS as rgb(37 99 235 / 50%).
What does #fff mean?
It's shorthand for #ffffff (white). Each digit is doubled.
Is it free?
Yes, it's free and runs entirely in your browser.