Hex to RGB Converter
Translate hexadecimal color codes into RGB/RGBA format, including CSS helpers.
Convert a Hex Triplet Into Decimal RGB Channels
Hexadecimal color notation compresses three 8-bit sRGB channels into a short token. RGB notation writes those same channels as decimal integers. A hex to RGB converter is useful when an API, graphics program, test fixture, or CSS calculation expects rgb(red, green, blue) rather than #rrggbb.
Enter a value in Hex Color Code. The page converts supported three- and six-digit forms, renders the resulting color in a preview rectangle, and displays a complete CSS rgb() function under RGB Conversion. Press Copy to place that function on the clipboard. There are no separate channel fields, opacity controls, or output-format selectors.
The default illustrates the mapping: #3b82f6 becomes rgb(59, 130, 246). Each pair is independent: 3b is red, 82 is green, and f6 is blue.
The Arithmetic Behind the Answer
Hex uses base 16 with digits 0–9 and a–f. A two-character channel has a high digit worth sixteen times its value and a low digit worth its value. For 3b, hexadecimal 3 is decimal 3 and b is decimal 11:
3b = (3 × 16) + 11 = 59
82 = (8 × 16) + 2 = 130
f6 = (15 × 16) + 6 = 246
Every pair ranges from 00 to ff, corresponding to decimal 0 through 255. #000000 therefore produces rgb(0, 0, 0), while #ffffff produces rgb(255, 255, 255).
Three-digit shorthand repeats each nibble before conversion. #4af expands to #44aaff, resulting in rgb(68, 170, 255). It does not mean channels 4, 10, and 15. Shorthand can express only values whose paired digits match, so many six-digit colors have no exact three-digit equivalent.
A Focused Procedure for Reliable Use
- Identify whether the source is an RGB hex color, not a number serving another purpose.
- Paste
#rgbor#rrggbb; uppercase and lowercase letters are equivalent. - Confirm that the preview color matches the source context.
- Read or copy the
rgb(r, g, b)result. - Preserve the original hex separately if exact source traceability matters.
The leading # is optional because the converter removes it before parsing. Surrounding whitespace is trimmed. Canonical input is still preferable in documentation because 3b82f6 without a hash can be mistaken for an identifier.
Example: CSS with a separate alpha channel
Suppose a design specification provides #1d4ed8, but a component needs a translucent background. Convert it to decimal channels, then add alpha yourself using modern CSS:
.selection {
background: rgb(29 78 216 / 20%);
}
The copied output uses comma-separated rgb(29, 78, 216) and contains no alpha. Editing it into a slash-alpha form is a downstream step. The converter does not calculate an RGBA result despite general color workflows often needing one.
Example: application configuration
A chart library might ask for an array such as [236, 72, 153]. Convert #ec4899, then transfer the three numbers without the CSS wrapper. Check that the library expects 0–255 integers rather than normalized 0–1 channels; those conventions are not interchangeable.
Input Boundaries You Should Know
Supported input has exactly three or six hexadecimal characters after trimming and removing #. Four-digit #RGBA and eight-digit #RRGGBBAA values are not supported. CSS color names, HSL strings, RGB strings, and wide-gamut functions are also outside the parser.
There is no explicit invalid-input alert. When input length is incomplete or parsing fails, the converter retains its previous valid RGB state. The preview consequently remains the previous color. If you erase the field and type a new value slowly, the old result can be visible until the new code reaches a valid form. Treat a matching preview as part of validation before copying.
JavaScript’s hexadecimal parser accepts standard hex digits case-insensitively. Avoid extra punctuation, doubled hashes, comments, or values copied with a semicolon. A value such as #fff; has the wrong length and will not become white.
The simple cleaning logic removes hash characters rather than enforcing one leading hash. Well-formed input keeps behavior predictable; permissive cleaning should not be considered support for unconventional syntax.
RGB Numbers Do Not Include Every Color Property
The output describes red, green, and blue channels in the sRGB-oriented CSS model. It does not include alpha transparency. It does not indicate a color profile, ICC metadata, HDR intensity, or a semantic role such as “primary button.” It also cannot recover information that was not present in the hex triplet.
Hex and RGB are not different colors when they encode the same channels. Changing notation alone does not improve contrast, alter brightness, or convert between sRGB and Display P3. #ff0000 and rgb(255, 0, 0) are equivalent CSS colors under ordinary interpretation.
If a design source is in CMYK, Lab, OKLCH, or a device-specific profile, first perform an appropriate color-space conversion. Merely treating its numbers as an RGB hex token can shift appearance substantially.
How to Interpret Channel Values
Large channel values mean more intensity for that primary, not necessarily higher perceived brightness by equal amounts. Human vision is more sensitive to green than blue. rgb(0, 255, 0) appears brighter than rgb(0, 0, 255) even though each has one channel at 255.
Neutral grays have equal channels: rgb(32, 32, 32), rgb(128, 128, 128), and rgb(240, 240, 240). A warm near-gray often has red slightly above blue; a cool near-gray often reverses that relationship. These observations help catch swapped channels when transferring values manually.
Channel order is always red, green, blue. Writing the numbers as blue, green, red is a common error when moving between systems whose binary pixel layout is BGR or BGRA. The converter outputs CSS RGB order only.
Quality Checks for Real Projects
When migrating design tokens, convert a representative sample and compare screenshots rather than assuming every token is six-digit hex. Search for alpha-bearing tokens before bulk conversion. Keep lowercase or uppercase conventions separate from visual equivalence; this output is numeric and loses the source’s letter casing.
For accessibility, feed the resulting foreground and background colors into a contrast-ratio tool. No individual channel threshold proves readability. For visual regression tests, compare rendered pixels with tolerance for browser antialiasing rather than comparing #3b82f6 and rgb(59, 130, 246) as unequal strings.
When documenting a conversion, keep the channel labels visible at least once: red 59, green 130, blue 246. A bare tuple can be misread when transferred into systems that use BGR ordering. In code review, retaining both source and converted value in the change description makes it easier to verify that the edit changes syntax rather than appearance.
Common mistakes are omitting a leading zero from a six-digit code, interpreting shorthand without expansion, expecting alpha preservation, copying the stale result after malformed input, and assuming RGB integers are percentages. CSS supports multiple RGB syntaxes, but this tool specifically returns integer channels with commas.
Confirm each channel independently
For a quick audit, split a six-character source after the second and fourth characters and convert each pair separately. The component follows exactly that order with slice(0, 2), slice(2, 4), and slice(4, 6). This catches accidental channel rotation and makes leading zeroes visible. With shorthand, perform expansion first: #09c becomes pairs 00, 99, and cc, not 09, an incomplete middle pair, and c. If the input is being edited and the displayed RGB has not changed, do not infer that the new text maps to the old swatch; the current value may simply have failed the supported-length check.
Hex to RGB FAQ
What does #fff convert to?
It expands to #ffffff, then converts to rgb(255, 255, 255).
Can this convert #ffffff80 to RGBA?
No. Eight-digit hex input is not processed, and the output has no alpha channel. Remove and convert the RGB portion only if discarding alpha is intentional.
Why is the old RGB value still showing?
The component updates only after receiving a valid supported input. Incomplete or invalid text leaves the previous result in place rather than clearing it or showing an error.
Is the hash required?
No. 3b82f6 and #3b82f6 both convert. Including the hash communicates that the string is a color and is recommended when sharing it.
Are uppercase hex letters different?
No. #FF8800 and #ff8800 encode identical channel values.
Does RGB output work in CSS?
Yes. The copied string uses established CSS syntax such as rgb(255, 136, 0). Some codebases may reformat it to the modern space-separated syntax.
Does conversion affect color accuracy?
Not for a valid six-digit sRGB hex color: it is a direct base-16 to base-10 representation of the same bytes. Accuracy concerns arise when the source belongs to a different color space or when unsupported alpha is discarded.