RGB to HEX Converter
Free online rgb to hex converter. Convert RGB values to hex codes. Perfect for designers and developers.
#FF6B6B
Embed this tool
Copy and paste the code below into your website to embed this tool for free. An attribution link to The Util Box is required.
<iframe src="https://www.theutilbox.org/embed/rgb-to-hex" width="600" height="500" frameborder="0" style="border: none; max-width: 100%;" title="Free RGB to HEX Converter tool from The Util Box"></iframe> <!-- Free tool by The Util Box — https://www.theutilbox.org/tools/rgb-to-hex --> <a href="https://www.theutilbox.org/tools/rgb-to-hex">RGB to HEX Converter by The Util Box</a>
Frequently Asked Questions about RGB to HEX Converter
RGB to HEX Converter — Build a Colour and Read Its Hex Code
This RGB to HEX converter works the other direction from the hex converter: you set red, green and blue channel values, and it gives you the hexadecimal equivalent. Each channel has both a numeric input (clamped to 0–255) and a slider, so you can type an exact value or drag to find a colour by eye. A live swatch shows the result as you move, and the code is shown in uppercase with a one-click copy button.
The design intent here is different from a lookup table. You are not searching for a known colour — you are building one, which is why the sliders and the swatch matter as much as the output.
How the Conversion Works
Each RGB channel is a number from 0 to 255. HEX writes the same three numbers in base 16, two digits per
channel, so each channel becomes a pair of hex digits. The digits run 0–9 then A–F, where
A is 10 and F is 15. Every channel is padded to
two digits, so a value of 5 becomes 05, not 5.
| Channel | RGB | HEX digits | Result |
|---|---|---|---|
| Red | 255 | FF | #FF6B6B |
| Green | 107 | 6B | |
| Blue | 107 | 6B |
The default values in the tool are 255, 107, 107, which produce #FF6B6B — a
soft coral red, the value you see on load. Values are rounded to the nearest whole number, so a fractional
channel such as 106.6 becomes 107. The clamping also means typing 300 or −20 resolves to 255 or 0 rather than
producing an invalid code.
The Shorthand Hint
When all three channels happen to be a repeated hex digit — that is, when each pair is
AA-style such as FF,
00 or 6B — the colour can be written in the
3-digit shorthand by dropping one digit from each pair. This tool surfaces that only when it genuinely applies,
so #FF6B6B gets no hint, while pure red #FF0000
would be flagged as reducible to #F00.
This is a genuine compression, not a cosmetic one — it is a shorter token in your stylesheet. It only appears for 216 of the 16.7 million possible colours, so most results have no shorthand, and the tool does not pretend otherwise.
Upper or Lower Case?
This tool outputs uppercase, so #FF6B6B. CSS treats hex codes
case-insensitively, so it is purely a style question — but consistency matters when you are scanning a
stylesheet or comparing values. Lowercase (#ff6b6b) is the more common convention
in modern CSS tooling and in most design-system documentation, because that is what the CSS Color Module
examples use. Pick one and keep to it.
Related Colour Tools
- HEX to RGB — the reverse, when you already have the hex code.
- HEX to HSL — for building tints and shades systematically, since lightness is one slider rather than three channels.
- HEX to RGBA — add transparency, which a 6-digit hex code cannot express.
- RGB to CMYK — needed before sending artwork to a commercial printer.
- Color Blender — mix two colours instead of adjusting three channels by hand.
- Tint and Shade Generator — produce a full ramp of lighter and darker versions from one colour.
- Contrast Checker — confirm the colour works for text before you commit to it.
- Color Name Finder — get a human-readable name for a colour you have just built.
Everything here runs client-side, so it works offline and never sends your brand colours anywhere.