RGB to HEX Converter – Paste an RGB or rgba value — such as rgb(52, 152, 219), 52 152 219, or 52,152,219 — or enter each channel separately to get a six-digit HEX code, live preview, HSL data, and one-click copy.
Converted color
Live preview of the color your inputs produce.
Channel mix graph
How the three channels compare.
Table of Contents
What is RGB colour value?
An RGB color value references a colour by combining three colours: red, green and blue. The intensity for each channel is from 0 (off) to 255 (on), and this range is encompassed by a single byte of computer memory. Each individual pixel is constructed by having very small red, green, and blue subpixels, which emit light at varying intensities and intensities, and then your eye merges the three sub-pixels to see a single color.
It is used in code all over the place: in CSS rgb(52, 152, 219), in older canvas/GL code, you can enter ints into the graphics pipelines, and design software allows you to type channel values into numeric fields. An RGB to HEX converter converts the RGB notation into the smaller hexadecimal notation — #3498db — without altering the color.
How the converter works
Converting 3 decimal numbers to a hex code is a fun 2-step operation:
- Convert each channel to base 16. Divide the number by 16, the quotient is the first digit, the remainder is the second. For red 52, that is 3 remainder 4 → digits “34”.
- Join the three pairs. Green 152 is changed to green 98; blue 219 is changed to blue db; the final code is “3498db”. Just add the # at the beginning and you get #3498db which is the same as CSS.
Each channel is represented by a value between 0 and 255, and thus always has a pair within 00 and ff, making the hex code always 6 characters long. This tool performs the conversion in real time, and displays the matching HSL values as well, allowing the user to think in terms of HSL as well as raw channel values.
When an RGB to HEX converter makes its mark.
- Design-to-code handoffs. A designer provides rgb(242, 132, 130) for the second button, you need to parameterize for hex. This page provides one paste that will preserve the design of the token.
- Tuning colors numerically. If you need a less intense blue, you can use the RGB values of 52, 160 and 220 to achieve a more subtle tone, with this converter displaying the HEX value instantly, so you can integrate that shade into your design process.
- Working with legacy code. A lot of rgb() values can be found in old CSS files and server-side templates. The task of normalizing to HEX is quick and mechanical once you have refactored a stylesheet onto a token system.
- Teaching color theory. Addressing students’ questions about how (255, 0, 0) translates to #ff0000 makes the base-16 system concrete and helps students to understand a notation they might otherwise see as random text.
- Creating building style guides and documentation. Documentation tables look tidier with a single canonical hex column than with free-form rgb strings of varying spacing and syntax.
RGB and hex color codes: Pro tips
- Know the power-of-two landmarks. 0 → 00, 128 → 80, and 255 → ff anchor your mental map. Once you know that 51 = 33, 102 = 66, and 153 = 99, you can estimate any channel’s HEX pair almost instantly.
- Use 3 digit shorthand at appropriate times. The compact form is only accepted by CSS if each pair repeats its digit, e.g., #11aa33 is #1a3. That is a color that can’t be shortened, #1a2b3c.
- Use lowercase hex in new code. Lowercase is slightly more relaxed in longer stylesheets and will be easier to grep for a particular color amongst tools. Most linters default to one, anyway — lowercase and be consistent.
- Treat alpha separately. HEX is not transparent, it contains only the red, green, and blue channels. Convert an rgb() value here and use the opacity separately, or use the 8-digit hex extension #3498dbcc if your browsers support it.
- Double-check with the eyedropper. Your converter has succeeded at getting the pair conversion correct since DevTools eye dropper displays both notations for any color on screen.
Related Tool
RGB to HEX converter FAQ
What is the manual way to convert RGB to HEX?
Divide each channel by 16, the first number is the first HEX digit and the remainder is the second number (10 = a, 11 = b, etc., up until 15 = f). Next, join the three pairs together and add a hash at the beginning. For rgb(52, 152, 219): 52 → 34, 152 → 98, and 219 → db, giving #3498db.
What is the difference between RGB and HEX?
They are the same color, but have different notations. RGB specifies each channel’s intensity as a decimal number between 0 and 255; HEX specifies each channel’s intensity as a pair of base-16 numbers between 00 and ff. Both forms are treated the same by browsers. rgb() reads naturally, and is extendable with alpha – both HEX and rgb are compact.
Why is rgb(255,0,0) equal to #ff0000?
Because 255 ÷ 16 = 15 remainder 15, and the value 15 is written as f in HEX. When the red channel is at its highest, and green and blue are at zero, the color is 100% red. An ff channel is a full channel.
May be able to convert HEX to RGB here?
This page will convert RGB to hex values only; the other way round, HEX to RGB, is performed by this companion RGB to HEX converter site. Both tools will take the plain numbers and provide you with real-time previews—so choose whichever direction suits the format you are beginning with.
What about rgba() values with alpha?
Alpha is independent of the color values—there are three channels for the core color. When using an 8-digit hex code, use an opacity property, like rgba(), to preserve opacity for the red, green, and blue triplet; otherwise, preserve opacity by converting the color in this way.
How this converter calculates results
The converter checks each channel for the range of integers 0 to 255, and then translates each decimal number to a pair of 2-digit numbers in base-16; it then combines the pairs in red-green-blue format. The absolute HSL values are determined from the normalized RGB channels, while the perceived lightness is based on the conventional relative luminance weights of red, green and blue.
All applications are executed in your browser. This page is not uploaded or stored any color values, and the tool is not based on login.
Last updated: September ️10, 2026 | Method: client-side RGB-to-HEX conversion
Disclaimer – This RGB-to-HEX converter is provided as-is for convenience and educational purposes. It uses standard base-16 arithmetic and should be verified against your design system before production use. Displayed colors can vary across monitors, print workflows, and device settings.
Calculators | Converters | Games | Generators | Random | Web Tools | Developer Tools