RGB to HEX Converter

How the Conversion Works

You enter three decimal numbers — one each for red, green, and blue — and the page immediately shows you the equivalent six-digit hex colour code. There is no “convert” button; editing any field (RGB, hex, HSL, HSV, CMYK, LAB, or the colour picker) updates every other field in real time. The RGB input accepts numbers separated by commas or spaces, for example 79, 70, 229. The tool then takes each 0–255 decimal value, divides it by 16, and maps the quotient and remainder to hexadecimal digits. The result is a # followed by six hex characters: #4F46E5.

Because RGB and hex represent exactly the same colour space, the conversion is lossless — no rounding, no approximation, no gamut clipping. The tool processes everything in your browser; nothing you enter is sent anywhere.

The RGB Model and the 0–255 Scale

RGB is an additive colour model. Red, green, and blue light are combined to produce a colour. On a typical display, each pixel contains three subpixels that emit varying intensities of those three primary colours. The intensity for each channel is stored as an 8‑bit integer, giving 2⁸ = 256 possible levels per channel, numbered 0 (no light) to 255 (full intensity). With three channels, the model can represent 256³ ≈ 16.7 million distinct colours — the full set of sRGB colours visible on most monitors.

The 0–255 range is a direct consequence of 8‑bit colour depth. For front‑end developers, this range appears everywhere: CSS rgb() function expects values from 0 to 255 (or percentages); browser DevTools return RGB triples in the same range; image‑editing software like Photoshop and GIMP use 0–255 sliders. When you need to convert that triple to a hex code for a style sheet, you are performing an exact mathematical transformation, not an interpretation.

Hexadecimal Colour Codes: Structure and Notation

A hex colour code consists of a # character followed by six hexadecimal digits. Each pair of digits represents the intensity of a single channel: the first two digits are red, the middle two are green, the last two are blue. For example, #4F46E5 breaks down as:

• 4F → red: 4×16 + 15 = 79
• 46 → green: 4×16 + 6 = 70
• E5 → blue: 14×16 + 5 = 229

The six‑digit form is the standard. Three‑digit shorthand (#abc) is an alternative for colours where each pair consists of two identical digits — for example, #AABBCC can be written #ABC. This tool’s output always uses six digits; it never automatically collapses pairs. However, the hex input field does accept three‑digit shorthand (e.g., #abc), which the tool expands internally to six digits (#AABBCC). This keeps the output unambiguous and ready to copy directly into CSS, where the six‑digit form is more widely supported and eliminates confusion.

Hexadecimal digits are case‑insensitive in CSS and most design tools. #4F46E5 and #4f46e5 are identical. The tool preserves whatever case you use in the input field but standardises the output to uppercase for readability.

The sRGB Working Space (Lossless Conversion)

sRGB (standard Red Green Blue) is the default colour space for the web, most consumer displays, and digital cameras. It was co‑developed by Microsoft and Hewlett‑Packard in the 1990s to create a standard colour space that devices could target. Both the RGB (decimal) and hex (hexadecimal) representations on this page refer to the same sRGB colour values. Because the conversion between decimal and hex is purely arithmetic, there is no gamut clipping, no mapping to a different colour space, and no loss of precision.

This is not the case when converting, say, RGB to CMYK or RGB to LAB. Those conversions involve different colour models (subtractive vs. additive) and different working spaces, so the result may fall outside the target gamut or require approximations. But RGB to hex is a one‑to‑one mapping: every valid RGB triple corresponds to exactly one six‑digit hex code, and vice versa. That is why the tool can update all other colour formats (HSL, HSV, CMYK, etc.) simultaneously — those conversions do involve transformation, but the underlying RGB value stays fixed.

Using the Tool: Input Rules and Edge Cases

The RGB field expects three numbers in the range 0–255. They can be separated by commas (,), spaces, or a mix of both. Leading zeros are acceptable and ignored — 079, 070, 229 is equivalent to 79, 70, 229. The tool parses the string, validates each number, and if everything is valid, updates the hex display and the colour swatch instantly.

What happens when input is invalid? If you enter values outside 0–255, or a non‑number, or fewer or more than three values, the tool shows the error message: “Enter RGB as three numbers 0–255, like 79, 70, 229.” The previous valid conversion remains visible until the input is corrected. This behaviour prevents accidental overwriting of a valid colour while typing.

What about the hex input field? It accepts both six‑digit codes (#4F46E5) and three‑digit shorthand (#abc). If you type a three‑digit code, the tool expands it internally and updates all other fields accordingly. If you type an invalid hex code (e.g., missing #, or characters outside 0‑9 and A‑F), the tool shows an appropriate error message.

Why is there no eight‑digit hex output? Eight‑digit hex includes an alpha channel (e.g., #4F46E5FF for fully opaque). The hex output from this RGB‑to‑hex conversion carries no alpha because the RGB input does not include one, so the RGB‑input route will never produce an eight‑digit code. The hex input field accepts only six‑digit and three‑digit codes; an eight‑digit code is rejected as invalid.

Practical Applications for Developers and Designers

• CSS properties such as color, background-color, border-color, and box-shadow accept hex values. When a design is specified as RGB triples in a mockup (e.g., from Figma or Photoshop), converting to hex is the fastest way to drop the colour into a style sheet.
• UI/UX design handoff often requires hex codes for consistency across tools. Many design tools (Figma, Sketch, Adobe XD) export colours as hex by default; if you receive RGB values, this page provides the equivalent hex in one glance.
• Image‑editing workflows — Photoshop’s colour picker displays RGB values; when you need to use that colour in a web project, copy the hex code from this tool rather than manually calculating 16‑times tables.
• Learning digital colour — students experimenting with colour mixing see how decimal channel intensities correspond directly to hex pair values. Typing 255, 0, 0 and seeing #FF0000 reinforces the structure of the hex system.
• Browser DevTools often show computed colours as RGB triples. If you want to store that colour in a CSS custom property as a hex string, this tool saves you from mental arithmetic.

Input Formatting Best Practices

FAQ

1. Can I enter decimal fractions like 127.5?
No. The tool expects integers between 0 and 255. Fractional values are invalid and will trigger the error message.

2. Why doesn’t the output ever show three‑digit hex like #ABC?
The tool always produces six‑digit codes for clarity and maximum compatibility. Three‑digit shorthand only works when each pair has identical digits; six‑digit codes are unambiguous and accepted everywhere. The hex input field does accept three‑digit shorthand, but the output never collapses it.

3. Does this tool support alpha transparency?
The RGB input has no alpha channel, so the hex output has no alpha component. If you need an eight‑digit hex with alpha (e.g., #4F46E5FF), you can enter the six‑digit code into a hex input field that supports it, or use the tool’s hex field directly. The reverse conversion (hex to RGBA) is on a different page of the site.

4. What happens if I type a value like 255, 255, 255?
You get #FFFFFF (white). The colour swatch updates to pure white, and all other format fields reflect that colour.

5. Does the tool remember my last conversion if I refresh the page?
No. All processing is local and transient. Refreshing the page returns the tool to its default state or the last saved state in your browser’s session storage (if implemented). There is no cloud storage.

6. Can I use this page offline?
Given that all processing happens in your browser with no server calls, the page works offline once it has been loaded at least once. The colour picker and format conversions are implemented client‑side.