RGB to Hex Color Code Converter (and Hex to RGB) — Free, No Sign-Up
Enter an RGB value or a hex color code to convert it instantly the other way. Works both RGB-to-hex and hex-to-RGB, so you get a code ready to paste into CSS or your design tool right away — free, no sign-up required.
Decimal (Base 10)
| R | |
|---|---|
| G | |
| B |
Hex (Base 16)
| # |
|---|
How RGB and Hex Colour Codes Relate
A colour on screen is decided by how much of three lights — red, green and blue — are mixed. Expressing the strength of each as a number from 0 to 255 gives you RGB format; rewriting those same values as two hexadecimal digits each and lining them up gives you the hex colour code #RRGGBB. In other words the two are simply different notations for the same colour, and this tool converts between them.
There are two notations because they suit different jobs. Hex expresses a colour in six characters, which makes it convenient for handing colours between CSS and design tools. RGB, on the other hand, shows each component as a visible number, which makes adjustments like «push the red up slightly» far easier. Both formats are shown so you can use whichever fits the task in front of you.
How to Use the Colour Code Converter
- Enter the value you want converted Put R, G and B values into the decimal fields, or a colour code into the hex field. Conversion works from either direction.
- Read the other format The corresponding value appears as you type, ready to copy straight into CSS or a design tool.
- Adjust the values and try colours out Raising and lowering the numbers on the decimal side makes the change in colour easy to follow, so you can close in on the shade you are after.
Tips for getting more out of it
- In CSS you can specify colors in both
#RRGGBBandrgb(R, G, B)formats. - Each channel — R (red), G (green), B (blue) — ranges from 0 to 255 (00 to FF in hex).
- White is
#FFFFFF(255, 255, 255) and black is#000000(0, 0, 0). - Design tools like Figma and Adobe XD support both formats, so you can copy a value and use it directly.
- The shorthand
#FFFis equivalent to#FFFFFF(white) and is valid CSS.
When Colour Code Conversion Comes in Handy
Handing a colour from design to code
Convert a colour your design tool shows in RGB into the hex format CSS expects, and avoid mistakes from converting by hand.
Reproducing a brand colour accurately
When a specified colour reaches you in only one of the formats, convert it to the other and keep everything consistent. It stops colours drifting between a document and the web.
Adjusting a colour a little at a time
Adjustments that are hard to judge in hex become intuitive once you switch to RGB numbers — well suited to fine-tuning brightness or hue.
Investigating an existing site's palette
Convert a colour code picked up in developer tools and you can see the strength of each component as a number.
Colour Code Terms
- RGB
- A scheme that expresses colour through the strength of red, green and blue light. Each takes a value from 0 to 255, and all three at 255 gives white.
- Hexadecimal
- A notation that represents numbers with sixteen symbols, 0 through F. Because it covers 0 to 255 in exactly two digits, it is used for colour codes.
- Shorthand
- The abbreviated three-digit form such as
#FFF. It can only be used when both digits of each component are the same character. - 24-Bit Colour
- A scheme that allots eight bits to each component. Together they express roughly 16.77 million colours.
- Channel
- Each individual component that makes up a colour. In RGB, red, green and blue are one channel each.
FAQ
#FFFFFF and #ffffff are treated identically in CSS. Hex color codes are case-insensitive.#RRGGBB → #RGB). A value like #1DA1F2 cannot be shortened.
Side Note — The Mystery of Color: The Human Eye and 16.7 Million Colors
The human eye is estimated to distinguish about 10 million colors (individual variation applies). 24-bit RGB color (8 bits per channel) can represent 16,777,216 colors — far exceeding human perceptual limits.
Famous brand colors in RGB: Twitter Blue #1DA1F2 (29, 161, 242), Google Red #EA4335 (234, 67, 53), LINE Green #00B900 (0, 185, 0). Tiffany's iconic blue — Tiffany Blue — is close to #0ABAB5 and is one of the few trademarked colors in the world.
An interesting story: CSS has a named color called rebeccapurple (#663399). It was proposed by the CSS community as a tribute to Rebecca, the 6-year-old daughter of CSS specification author Eric Meyer, and officially adopted in 2014. It remains a deeply remembered story in the engineering community.