Convert RGB to HEX Red Green Blue ↔ Hexadecimal Free Online Secure
Type a value in RGB and read it in HEX at once. The arithmetic happens in your browser, nothing is sent anywhere, and what the conversion depends on is written out below rather than assumed.
Nothing uploaded
Where these notations come from
Hex and RGB are the same thing written twice. A screen colour is three numbers — how much red, green and blue light to emit — each from 0 to 255, which is one byte; hex simply writes those bytes in base sixteen, so #FF8800 and rgb(255, 136, 0) are the same instruction to the same pixel. HSL was invented because neither is readable by a human: it gives hue as an angle around a colour wheel, with saturation and lightness as percentages, so a designer can make something lighter without recomputing three figures. CMYK belongs to a different world altogether — ink rather than light. It is subtractive, built from four printing plates, and it cannot reach every colour a screen can, because a screen emits light while paper only reflects it.
Where you meet them
Hex is what you type into a stylesheet and what a design tool hands you. RGB appears wherever a colour needs arithmetic — gradients, transparency, code that computes a shade. HSL is what you reach for when adjusting a palette by hand, because the changes you want are usually changes of one of its three numbers. CMYK is what a printer asks for, and converting into it is the moment a design stops being light and becomes ink.
Questions people ask
Why does my CMYK result differ from what my printer gives me?
Because there is no single correct conversion. The arithmetic on this page is the simple, device-independent one, which is the right answer when you need a starting point or a rough equivalent. A print shop converts through a colour profile that accounts for the specific ink, paper and press, and the same RGB colour will produce different CMYK values on glossy stock than on uncoated. For anything that must match, ask the printer for their profile rather than trusting a formula.
Why can't some screen colours be printed?
Because the two cannot reach the same colours. A screen makes colour by adding light and can produce a vivid, saturated cyan or green that ink simply cannot match; paper makes colour by absorbing light, and the brightest it can ever be is the white of the page. The set of colours each can reach is called its gamut, and where they do not overlap, a conversion has to choose the nearest available colour. That is why a bright screen colour often looks slightly dulled in print.
Is the answer exact?
Where both units are defined in terms of one another by whole numbers, yes — the page says so above the figure, and the only rounding is in how many digits are shown. Where the ratio has no finite decimal, the page shows twelve significant digits and says the relation is approximate rather than pretending otherwise.
Does anything I type leave my device?
No. The arithmetic runs in your browser; nothing is uploaded and there is no server to upload it to. Load the page once and it keeps working with the network switched off.
Why you convert RGB to HEX
An image editor, a colour picker in the operating system or a line of code gives you a colour as three numbers: 90, 70, 50. A stylesheet, a design token file or a message to a colleague wants it as one short code: #5A4632. The step between them is what this page does. To convert RGB to HEX is to write the same three numbers in base sixteen, two digits each, and put a hash sign in front. It is easy to do for a single colour and tedious for twenty, and it is easy to get wrong when a number needs a leading zero or a digit is a letter.
The conversion is exact, which is not true of every colour conversion. Hex and rgb() are two spellings of the same three numbers, the amounts of red, green and blue light that a screen should emit, each from 0 to 255. Nothing is approximated, and a round trip returns what it started with. The page does it in your browser, and nothing is uploaded. Below you will find how each number becomes two hex digits, how transparency is carried over, the limits of sRGB, the places where people need to convert RGB to HEX, and a few habits that keep colours in a project consistent.
How the conversion works
Each number becomes two hex digits
Take rgb(90, 70, 50). Divide each number by sixteen: 90 is 5 times 16 plus 10, and 10 is the digit A, so 90 becomes 5A. 70 is 4 times 16 plus 6, so 46. 50 is 3 times 16 plus 2, so 32. Put the three pairs together and add the hash sign: #5A4632. The page does this for you as you type, and shows the sentence rgb(90, 70, 50) = #5A4632 so you can verify it.
Leading zeros
Every pair must have two digits. A number below 16 needs a zero in front: 7 becomes 07, and 0 becomes 00. So rgb(0, 7, 255) is #0007FF, not #07FF, which would mean something quite different. Forgetting the zero is the most common mistake when doing the conversion by hand.
The range
Each number must lie between 0 and 255. A value above 255 cannot be written in two hex digits, and a negative value has no meaning. If a calculation in your code has produced 270 or −5, limit it to the range first. The converter does the same, so that it never produces an invalid code.
What the conversion keeps and what it cannot
It keeps the colour, exactly
Hex and rgb() are two spellings of the same three numbers, 0 to 255 for red, green and blue, so nothing is approximated and a round trip returns what it started with. Convert RGB to HEX and back and you have the numbers you began with.
It carries transparency across
A fourth value for transparency is carried across too: #RRGGBBAA becomes rgba(), and back. A transparency of 0.5 becomes the pair 80, since half of 255 is about 128, which is 80 in hex. So rgba(90, 70, 50, 0.5) is #5A463280. Eight-digit hex is accepted by all current browsers.
It cannot describe colours outside sRGB
Both spellings describe sRGB, the colour space a screen has used for thirty years. They cannot describe a colour outside it, which is what the newer CSS notations, lab(), oklch() and color(), exist for. If you start from a colour in a wide-gamut tool, the three numbers you copy are already the sRGB version, and the hex is faithful to those.
It does not preserve the shorthand
Where a code could be written in three digits, such as #AABBCC as #ABC, the converter gives the long form. The long form is always valid and the same colour; the short form is only a convenience for the reader.
Common colours and their codes
A few to remember
rgb(255, 255, 255) is #FFFFFF, white: all three lights at full power. rgb(0, 0, 0) is #000000, black: no light at all. rgb(255, 0, 0) is #FF0000, pure red; rgb(0, 255, 0) is #00FF00 and rgb(0, 0, 255) is #0000FF. Any colour with three equal numbers is a grey, and its code has three equal pairs: rgb(128, 128, 128) is #808080.
The web-safe habit
Older guides spoke of web-safe colours, whose pairs were only 00, 33, 66, 99, CC or FF. They belong to the days of 256-colour screens and have no reason to survive. Use any value you like; the screen can show them all.
How to convert RGB to HEX here
Type the three numbers
Enter the colour in the first field in the form rgb(90, 70, 50), or with the numbers separated by commas or spaces. Percentages are not needed; use numbers from 0 to 255.
Read the hex code
The answer appears at once in the other field, starting with a hash sign, in capital letters. If you gave a fourth value for transparency, the code has eight digits.
Copy it into your work
Paste the code into the stylesheet, the token file or the message. Add it to your palette note so that the next conversion is a lookup.
Where these notations come from
Hex and RGB are the same thing written twice
A screen colour is three numbers, how much red, green and blue light to emit, each from 0 to 255, which is one byte. Hex simply writes those bytes in base sixteen, so #FF8800 and rgb(255, 136, 0) are the same instruction to the same pixel.
HSL and CMYK
HSL was invented because neither is readable by a human: it gives hue as an angle around a colour wheel, with saturation and lightness as percentages, so a designer can make something lighter without recomputing three figures. CMYK belongs to a different world altogether, ink rather than light. It is subtractive, built from four printing plates, and it cannot reach every colour a screen can, because a screen emits light while paper only reflects it. See HEX to HSL and RGB to CMYK.
Where you meet them
In design handoff
A designer works in an editor that shows rgb values or a picker; the developer needs hex for the stylesheet. Converting RGB to HEX is the step in the middle, and it is done for every colour in a palette.
In scripts that compute colours
A script that blends two colours or darkens one works with numbers and ends with three of them. To use the result in a stylesheet, or to display it, it must be written as a hex code. Doing it by hand in code is a few lines; checking the result with a converter is quicker.
In data visualisation
Chart libraries accept colours as hex strings. Palettes generated by numerical methods come out as rgb triples. A conversion step turns one into the other.
In documents and presentations
Office programs show colours as RGB numbers; web editors want hex. When a brand colour has to appear in both, the conversion keeps them identical.
Traps when you convert RGB to HEX
Forgetting the leading zero
Writing 7 as 7 and not 07 shifts every following digit. Always use two digits per pair.
Confusing percent with 0 to 255
rgb(35%, 27%, 20%) is a different spelling of the numbers, with 100 percent being 255. If your source uses percentages, convert them to 0 to 255 first: multiply by 2.55.
Rounding errors in computed colours
A script that produces 127.5 must decide whether it is 127 or 128. The difference is invisible, but it makes two codes for what you thought was one colour. Round the same way everywhere.
Taking the colour from a screenshot
A colour read from a screenshot has passed through the screen's colour management and perhaps compression. It may differ by a step or two from the source. Use the design file when you can.
Questions people ask before converting
What is rgb(255, 0, 0) in hex?
#FF0000, pure red.
What is rgb(0, 0, 0) in hex?
#000000, black.
Can I use lower case in the hex code?
Yes. #5a4632 and #5A4632 are the same colour. The page writes capitals.
Is the conversion exact?
Yes. It is two spellings of the same three numbers.
Is my colour uploaded?
No. The arithmetic runs in your browser and nothing is sent anywhere.
How do I go back?
With HEX to RGB, which reads the three pairs as numbers.
Habits that keep colours consistent in a project
Define each colour once
Put your palette in custom properties, such as --brand: #5A4632, and refer to colours by name. When you convert RGB to HEX for a new colour, you add one line, and every use follows.
Choose one case
Pick upper or lower case for hex codes and keep to it. A search for a colour in the code is then reliable.
Record the source
Next to each colour, note where it came from: the brand guide, a logo, a sampled image. When the question comes up whether a colour is correct, you know where to check.
Test contrast
For text on a coloured background, check the contrast ratio with a tool. The numbers from the rgb form feed straight into the formula, and the hex form is what you type into most checkers.
Why 256 steps, and what lies behind the numbers
Eight bits for each light
Each of the three numbers is stored in eight bits, which allows 256 values from 0 to 255. Three of them together give 256 × 256 × 256, about 16.7 million combinations, which is more than the eye can tell apart in most conditions. That is the reason hex codes are exactly six digits long: two for each light, no more and no fewer. When you convert RGB to HEX you are writing out three bytes in the most compact form people could agree on.
Why equal steps do not look equal
The numbers are not proportional to the light that reaches your eye. Screens apply a curve, close to a power of 2.2, so that dark tones get more of the 256 steps than bright ones, which suits the eye. A step from 10 to 20 looks like a bigger change than a step from 240 to 250. For you this means that averaging two colours by averaging their numbers does not give the colour you would see by mixing the lights, a fact that matters when you compute gradients and blends in code.
Greys and the diagonal
All the greys lie on the line where the three numbers are equal. There are 256 of them, from black at 0 to white at 255. If you convert RGB to HEX and the three pairs match, you know at once that the colour has no hue. A near-grey with pairs that differ by a step or two has a faint tint, which designers often use to give a neutral colour a hint of warmth or coolness.
Building and checking a palette
From a handful of picked colours to a palette
A typical palette has a primary colour, an accent, a neutral for text, a lighter neutral for surfaces and one or two signal colours for success and error. Pick each in your design tool, read its rgb numbers, and convert RGB to HEX for the stylesheet. Write them as custom properties with names that describe the role, and the palette is ready for use in every component.
Contrast between text and background
Readable text needs enough difference in brightness between the letters and their background. Accessibility guidelines define a contrast ratio calculated from the red, green and blue values of the two colours, and ask for at least 4.5 to 1 for normal text. Checkers accept hex codes, so the codes you produce here can go straight into them. Check each pairing you plan to use, not just the primary colour on white.
Converting a list
When you have many colours to convert, work through them one at a time and paste each result into a table with its name and use. It takes a minute per colour, and the table becomes the reference for the whole project. If a colour is later adjusted, only its row needs to change.
Keeping hex and rgb in step
If your project stores some colours as hex and others as rgb, it is easy for them to drift apart when someone edits one and forgets the other. Pick one as the master, usually hex, and derive the other with the converter whenever you need it.
Related converters
The same family of tools covers the neighbouring conversions. To go back, use HEX to RGB. For colours described by hue, HEX to HSL and HSL to HEX are at hand, and for print, RGB to CMYK, CMYK to RGB and CMYK to HEX. For the sizes in the same stylesheet, px to rem does for lengths what this page does for colours.
A worked example
Say a colour picker in an image editor tells you the accent of a photograph is rgb(214, 98, 56). You type the three numbers and read #D66238. In the stylesheet you write --accent: #D66238 and use it for buttons and links. A colleague asks what the colour is in the brand guide, and you send the code. Later you need a translucent version for a banner, and you convert it back with HEX to RGB to build rgba(214, 98, 56, 0.15). Both conversions are exact, so the banner is the same hue as the button.
A short checklist
Before converting
Check that each number is between 0 and 255. Decide whether you need transparency.
While converting
Type the three numbers, read the code and copy it with its hash sign.
After converting
Test the colour in context, on the real background, and check the contrast of any text that sits on it.
Common mistakes
Dropping a leading zero
Each pair has two digits. 7 is 07.
Writing numbers above 255
They cannot be written in two digits. Limit them first.
Treating the screen as the truth
The numbers are exact. The look depends on the display.
Your colours stay on your device
The calculation happens locally. Your values are used by your own browser and nothing is sent anywhere. There is nothing to delete afterwards and no account to create. That is the plain way to convert RGB to HEX.
Summary
To convert RGB to HEX here, type the three numbers and read the hex code at once. The conversion keeps the colour exactly: hex and rgb() are two spellings of the same three numbers, 0 to 255 for red, green and blue, so nothing is approximated and a round trip returns what it started with. A fourth value for transparency is carried across too, since rgba() becomes #RRGGBBAA, and back. Both spellings describe sRGB, so they cannot describe colours outside it. Every pair has two digits, so a number below 16 gets a leading zero. Nothing is uploaded.