Output #667EEA rgb(102, 126, 234)

A simple RGB to HEX Converter. Convert RGB values to hexadecimal format instantly.

Last updated: September 23, 2026

Features

Interactive sliders for red, green, and blue channels (0-255)
Live color preview shows your selection in real-time
Direct number input for precise control
One-click copying for both HEX and RGB values
Clean, intuitive interface with smooth transitions

What It Does

Drag the sliders. Watch the color change. The tool displays both rgb(r, g, b) and #hexcode formats simultaneously. Need a specific shade? Type the exact values. Copy either format with a single click.

Perfect for:

Web designers matching brand colors
Developers writing CSS
Digital artists finding exact color codes
Anyone converting between color formats

No installation. No signup. Just color conversion that works.

What Is RGB to Hex Conversion?

RGB to hex conversion turns three separate red, green, and blue numbers into one six-character code that browsers and design tools read as a single color.

The RGB model expresses color as three channel values, each running from 0 to 255, based on how much red, green, and blue light combine on a screen.

A hexadecimal value packages those same three numbers into a compact string, prefixed with a hash symbol, and that string can be pasted directly into HTML or CSS without extra parsing.

Slack's own brand guidelines list its signature purple both ways: #4A154B in hex and 74, 21, 75 in RGB, the exact pairing a converter produces (Slack brand guidelines).

The two formats describe the identical color. Nothing about the pixel changes, only how the number is written.

RGB is the native format for screens, since displays are built from red, green, and blue subpixels
Hex is the shorthand format most commonly seen in HTML and CSS
A converter simply translates between the two, it never alters the visible color

What it is not: a color picker, a palette generator, or a tool for identifying a color's name.

It performs one job: turning the numbers that define an RGB color into their hexadecimal equivalent, and it does that job the same way every time.

How Does the RGB to Hex Conversion Formula Work?

Each RGB channel gets converted separately: the decimal number is translated into a two-digit hexadecimal pair, and the three pairs are joined into one string.

Hexadecimal is a base16 system, so instead of counting 0 through 9 like decimal, it counts 0 through F, where F stands for 15.

Per-Channel Calculation

Converting one channel comes down to a single division problem, run once for red, once for green, once for blue.

Divide the decimal value by 16
The whole number result becomes the first hex digit
The remainder becomes the second hex digit

A value of 255 divides into 16 with a remainder of 15, giving the digits F and F, or FF.

The 0 to 255 range every channel uses traces back to the sRGB color space, standardized by the IEC as IEC 61966-2-1 in 1999 and still the default assumption for untagged web colors.

Combining the Three Pairs

Once red, green, and blue each have their two-digit hex pair, the three pairs are written one after another, with a hash symbol in front.

Red 255, green 87, blue 51 becomes FF, 57, 33, which combines into the single hex value #FF5733.

A few figures make the scale of this system easier to picture.

0 to 255 possible values per channel, 256 total
16,777,216 unique colors addressable across all three channels combined
Two hex digits per channel, six digits total for a standard color
Base16 numbering, where each digit runs from 0 through F

How Does RGBA Convert Into an 8-Digit Hex Code?

RGBA adds a fourth value on top of red, green, and blue: an alpha channel that controls transparency.

Converting RGBA into hex works the same way as RGB, except a fourth hex pair gets added at the end for the alpha value.

The W3C's CSS Color Module Level 4 formalized this 8-digit notation as a Candidate Recommendation in July 2022, catching up to what browsers had already started shipping.

Browser support followed closely: caniuse.com's compatibility tables list support in Chrome 62, Firefox 49, Safari 10, and Edge 79, years before most sites started using the format.

#RRGGBB: six digits, fully opaque by default
#RRGGBBAA: eight digits, the last pair sets opacity from 00 (fully transparent) to FF (fully opaque)

A value like CC in that last position works out to roughly 80 percent opacity, the same result you'd get from a decimal alpha value in CSS.

Not every project needs this. If a color never changes transparency, the plain six-digit code stays simpler and slightly shorter to type.

Going the other direction, from a hex string back to individual channel values, is just as common, and a dedicated hex to rgb converter handles that reverse math without any manual division.

What Are the Advantages and Disadvantages of Hex Codes Compared to RGB Values?

Hex codes win on brevity and adoption, RGB values win on editability, and most professionals end up using both depending on the task.

Hex advantages:

Shorter to type and paste into a stylesheet
One token instead of three comma-separated numbers
The de facto standard for sharing a color code with someone else

Hex disadvantages:

Harder to read at a glance, FF5733 doesn't obviously mean "a warm orange" the way rgb(255, 87, 51) does
Editing a single channel means recalculating the whole string by hand

HTTP Archive's 2021 Web Almanac found that 75 percent of all CSS color values use hexadecimal syntax, split between six-digit codes (50 percent) and three-digit shorthand (25 percent).

The functional formats trail far behind. rgba() came third at 14 percent, while plain rgb() rounded down to zero in that same dataset.

That gap says less about which format is technically better and more about habit: hex was CSS's original color format, and most style guides and design handoffs still default to it. Authors reach for rgba() mainly when they need transparency.

How Do RGB and Hex Compare to HSL and CMYK Color Models?

RGB and hex describe the same additive, screen-based color model. HSL and CMYK describe color differently, and neither converts to hex through simple division.

Model	Structure	Native Medium	Hex Conversion
RGB	Red, green, blue channels	Screens	Direct, one formula
HSL	Hue, saturation, lightness	Screens	Requires converting to RGB first
CMYK	Cyan, magenta, yellow, key (black)	Print	No fixed formula, depends on ink profile

HSL is arguably easier for humans to reason about, since dragging the hue slider rotates through the color wheel while saturation and lightness stay fixed.

To move between the two additive models without doing the math by hand, use the RGB to HSL converter.

CMYK works on a subtractive principle built for ink on paper, not light on a screen, which is why a color that looks identical in RGB and hex can shift once it's printed.

That additive versus subtractive split gets covered in more detail in this RGB vs CMYK comparison.

Designers who move between web and print projects often keep both a hex value and a CMYK equivalent on file for exactly this reason.

Which RGB to Hex Converter Tools Work Best for Designers and Developers?

The right tool depends on whether the color needs converting once, constantly, or as part of a larger design system.

Browser-Based Tools

A standalone web-based converter is the fastest option for a one-off conversion, no installation, no account, paste the values and read the result.

Good for quick lookups during a build
No software to install or update
Usually free and works on any device with a browser

Design Software

Several design tools handle the conversion automatically, right inside the panel where the color gets chosen.

Photoshop: recalculates hex the moment the RGB sliders move
Figma and Sketch: show both formats side by side in the fill panel
GIMP: includes the same dual display in its color chooser dialog

Accessibility checkers that test color contrast almost always take hex as the input format, since WCAG Success Criterion 1.4.3 sets a minimum contrast ratio of 4.5 to 1 for normal text.

Developer Tools

Chrome and Firefox DevTools display the computed color of any element and let you toggle between hex, RGB, and HSL with a single click.

For automated or bulk conversion, small JavaScript libraries such as chroma.js handle the math programmatically, without needing a UI at all.

That approach scales better than manual lookups once a project has hundreds of colors defined as design tokens.

How Do You Convert RGB to Hex Manually, Step by Step?

Manual conversion is nothing more than the per-channel division shown earlier, run three times and written out in order.

It's worth doing at least once by hand. Understanding the arithmetic makes every automated result easier to trust.

Step 1: Write down the three RGB values, for example 46, 139, 87
Step 2: Divide the first value (red) by 16, keep the whole number and the remainder
Step 3: Convert the whole number and remainder into hex digits, using A through F for 10 through 15
Step 4: Repeat steps 2 and 3 for green, then for blue
Step 5: String the three two-digit pairs together with a hash symbol in front

Working through the example: 46 divided by 16 is 2 remainder 14, giving hex 2E for red.

139 divided by 16 is 8 remainder 11, giving hex 8B for green. 87 divided by 16 is 5 remainder 7, giving hex 57 for blue.

Put together, that's #2E8B57, a shade commonly labeled sea green.

The math never changes, only the numbers going into it, which is exactly why the same formula works whether it's done on paper or inside a script.

How Do You Convert RGB to Hex Using Code?

Both JavaScript and Python convert RGB to hex using a built-in base conversion method, not a dedicated color library.

The syntax differs, but the underlying math is identical to the manual formula covered earlier.

Language	Core Method	Handles Padding
JavaScript	Number.prototype.toString(16)	No, needs padStart()
Python	format() or the hex() builtin	Yes, with a format spec

In JavaScript

The toString() method accepts a radix argument, and passing 16 returns the hexadecimal representation of a number.

The catch: toString(16) drops leading zeros, so 5 becomes "5" instead of "05," breaking a six-character hex string.

Convert each channel with .toString(16)
Pad the result to two characters with .padStart(2, "0")
Concatenate the three padded pairs with a hash symbol in front

padStart() is part of the ECMAScript 2017 specification, added specifically to solve this kind of fixed-width string formatting problem (ECMA International, 2017).

In Python

Python skips the separate padding step. Its format specification mini-language handles width and zero-fill in one expression.

Writing f"{value:02x}" converts an integer to a two-character, zero-padded, lowercase hex string in a single line.

The 'x' presentation type for lowercase hexadecimal integers is documented in Python's own format specification reference.

Looping that expression across red, green, and blue and joining the results produces the same six-character output as the JavaScript version, with less code around it.

What Common Errors Occur During RGB to Hex Conversion?

Most conversion errors come from formatting, not math. The arithmetic is simple enough that the mistakes happen around it.

Missing leading zero: a channel value under 16, like 5, 10, or 15, produces a single hex digit instead of two, collapsing a six-character code into five.

Out-of-range input: feeding a converter a value above 255 or below 0 doesn't always throw an error.

The CSS Color Module Level 4 specification states that out-of-range values aren't treated as invalid. They're clamped to the nearest valid boundary at computed-value time (W3C).

That clamping is convenient for browsers, but it also means a typo like 355 silently becomes 255 instead of raising a flag.

Case confusion: hex is case-insensitive, so #FF5733 and #ff5733 render identically, mixing cases is a style choice, not a bug
Shorthand misreading: #f0a expands to #ff00aa, not #f00a, each single digit doubles rather than shifting position
Copy-paste drift: pasting an RGB triplet into the wrong field of a converter swaps channels without any error message

Standardizing on one format at the source avoids most of this.

The GOV.UK Design System publishes both formats side by side for every color, Primary blue for example at RGB 29, 112, 184 and #1D70B8, but instructs teams to reference the named variable rather than retyping the hex code by hand (GOV.UK Design System).

That single-source approach is why design systems rarely see the drift that hand-typed hex values cause in smaller codebases.

When Does RGB to Hex Conversion Not Apply?

The formula holds for standard 8-bit RGB and its hex equivalent, but a few real situations sit outside that scope entirely.

Scenario	Why Hex Doesn't Cover It	What To Use Instead
Wide-gamut displays	Hex assumes the sRGB color space	Display P3 or color() functions
Print production	CMYK is subtractive, not additive	A CMYK value with an ICC profile
Named system colors	Values like "Canvas" have no fixed RGB triplet	The OS-level color keyword itself

Apple's own developer documentation describes Display P3 as roughly 25 percent larger than the sRGB gamut that hex and standard RGB assume (Apple, WWDC).

A color built for that wider space can't be represented accurately by an ordinary six-digit hex code, since hex has no channel for gamut information at all.

The gap isn't theoretical. HTTP Archive's 2021 Web Almanac found that 79 percent of display-p3 colors used on mobile pages fell outside what sRGB, and by extension standard hex, can represent. Only around 100 pages used display-p3 at all, but the ones that did picked it for colors hex can't express.

Apple's own design guidance recommends checking brand colors in both P3 and sRGB before shipping, precisely because a hex value that looks right in one space can shift in the other.

Print is a separate case entirely.

A hex code converts cleanly to RGB and back, but it has no reliable path to CMYK ink percentages without an ICC profile in the middle, since screens mix light and presses mix ink.

System and named colors round out the list. Keywords like "Canvas" or "ButtonFace" resolve to whatever the operating system's current theme defines, so there's no fixed RGB triplet to convert in the first place.

FAQ on RGB to HEX Converter

What Is a Hex Triplet?

A hex triplet is the six-character string inside a hex code, one two-digit pair each for red, green, and blue.

The name describes the format, not a specific color, and applies to every hex value in use.

Is a Hex Code Just RGB Written Differently?

Yes. A hex code and its RGB equivalent describe the identical color, only the numeral base changes.

RGB counts in base 10, hex counts in base16. Neither format carries more color information than the other.

What Happens When an RGB Value Includes a Decimal?

Converters round the decimal to the nearest whole number first, since a hex digit can't represent a fractional channel value.

A value like 127.6 rounds to 128, then converts normally, with no warning shown for the rounding.

When Should You Use HSL Instead of RGB?

HSL works better while a color is still being adjusted, since changing lightness or saturation doesn't require recalculating three separate channel numbers.

RGB and hex fit better once a color is finalized and ready to store as a fixed value.

Do Photoshop, Figma, and Browser DevTools Calculate Hex the Same Way?

Yes, the underlying math is identical everywhere. It's a fixed formula, not something open to interpretation by any single tool.

What can differ is color profile handling, which occasionally shifts the displayed result between wide-gamut and standard files.

Why Does a Converted Hex Code Sometimes Look Wrong?

The hex value itself is rarely the problem. An uncalibrated monitor or a missing color profile can render the identical code differently across two screens.

Check the display calibration before assuming the conversion made an error.

Can Every RGB Value Convert Into a Valid Hex Code?

Any RGB triplet within the standard 0 to 255 range per channel converts into a valid hex code, with no exceptions.

The formula has no edge case inside that range, it produces one correct six-digit result every time.

When Does an RGB to HEX Converter's Output Need a Second Check?

An RGB to HEX Converter's output needs a second check in three situations: a wide-gamut source color, a print-bound project, and a value pulled straight from an uncalibrated screen.

Outside those three, the six-digit result stands as final and needs no further verification.

Source color inside sRGB
Destination is a screen, not a press
Screen calibration confirmed

Wide-gamut colors are still rare in CSS, but they're the ones most likely to shift when forced into a six-digit hex code, so a P3 source color is worth checking first.

Standardizing on hex trades per-channel editability for a shorter, portable code, a fair exchange once a color is finalized.

For a value headed to print rather than a screen, an RGB to CMYK converter handles the conversion sRGB math wasn't built to make.