RGB to HEX

Turn any rgb() value into a clean HEX code instantly, ready for CSS or a brand guide.

Step one — Paste your rgb() value

Also accepts bare numbers, like 79, 70, 229.

Step two — Your HEX color

Step three — The same color, every format

Steps to convert RGB to HEX

Paste your rgb() value, or just the three numbers, into the field.
Read the hex code that appears straight away.
Click it to copy, ready for CSS or a brand guide.
Want to tweak the color first? Send it through RGB to HSL.

How RGB to HEX conversion works

Each channel from 0 to 255 becomes a two-character base-16 pair, and the three pairs join behind a hash. The split into a 16s digit and a 1s digit is the whole trick:

Channel	Decimal	16s × 1s	HEX pair
Red	30	1 × 16 + 14	1E
Green	144	9 × 16 + 0	90
Blue	255	15 × 16 + 15	FF

Worked example: rgb(30, 144, 255) becomes #1E90FF. Going the other way is handled by HEX to RGB.

When a HEX code beats keeping RGB

RGB and HEX are the same color, but hex is the form most front-end work settles on, and there are good reasons for it. A hex code is shorter, pastes as a single token, and is what brand guides and design tools expect, so converting an rgb() value the moment it is final keeps a codebase tidy. The one time to stay in RGB is when you still need to read or animate a single channel.

What RGB to HEX is used for

Turning a color computed in JavaScript back into a clean CSS hex code.
Recording a brand color in the short form a style guide expects.
Normalising mixed rgb() and hex values in a stylesheet to one format.
Shortening a value before pasting it into a design tool that prefers hex.

How to convert RGB to HEX in JavaScript

In code the conversion is one line per channel: pad each to two digits and join them.

const hex = '#' + [r, g, b].map(n => n.toString(16).padStart(2, '0')).join(''); for r=30, g=144, b=255 that returns #1e90ff. Add .toUpperCase() if your guide prefers caps.

RGB to HEX vs HEX to RGB

The two conversions are mirror images, and knowing which you need saves a step. Going RGB to HEX shortens a computed color for CSS; going HEX to RGB expands a design-file code into channels you can read and animate. Neither loses any color, so you can round-trip freely.

Common RGB to HEX values

Color	RGB	HEX
White	rgb(255, 255, 255)	#FFFFFF
Black	rgb(0, 0, 0)	#000000
Red	rgb(255, 0, 0)	#FF0000
Dodger blue	rgb(30, 144, 255)	#1E90FF
Mid gray	rgb(128, 128, 128)	#808080

Why developers prefer HEX in stylesheets

Ask most front-end developers and they will reach for hex over rgb() in a stylesheet, and it is not just habit. One token is quicker to type, easier to scan in a long list of variables, and copies cleanly between a design tool and code. RGB earns its place when a value is calculated or animated, but for a static color sitting in CSS, hex is simply less to read and maintain.

Can a HEX code be shortened?

Sometimes. When all three channels use repeated digits, a six-digit hex collapses to three, so #1166FF can be written #16F. Most colors do not qualify, which is why the converter returns the full six-digit form by default:

Full HEX	Short HEX	Works?
#FFFFFF	#FFF	Yes
#1166FF	#16F	Yes
#1E90FF	none	No, digits differ

Will the hex code be uppercase or lowercase?

Either works and both mean the same color; uppercase is more common in style guides, lowercase in code.

Can every RGB value become hex?

Yes. Every 0 to 255 channel maps to exactly one two-character pair, so the conversion is always exact.

How do I convert rgba() with opacity?

The RGB part becomes the six-digit hex; append the alpha as a seventh and eighth digit, so rgba(30, 144, 255, 0.5) is #1E90FF80.

Why does my hex look different from the RGB I entered?

Check the channel order and that each value is 0 to 255; a value above 255 is clamped before conversion.