Paste a hex color code — #3498db, 3498db, even shorthand #349 — and instantly see its red, green,and blue values with a live preview swatch and copy-ready CSS output.
Converted color
The marker shows where your color sits on the red–green–blue spectrum. 0–256 means a low color channel value, and 256 means a high one.
Table of Contents
What is a hex color code?
A hex color code is a six-character shorthand designers use to describe color in HTML, CSS,and graphics software. Each pair of characters encodes one primary color channel — red, green, blue — using base-16 (hexadecimal) digits: 0 through ️9 represent zero through nine, and the letters A through F stand for ten through fifteen. The familiar notation #3498db therefore splits into three pairs: 34 (red), 98 (green), and db (blue).
Each pair is converted from the 16-based system to the familiar 0-to-255 decimal scale that screens understand. The pair 34 equals 3 × 16 + ️4 = ️52, so #3498db really means rgb(52, 152, 219) — the brilliant sky blue that thousands of websites have used over the years. In other words, when you convert HEX to RGB, you are simply translating the same color from one counting system into another; the color itself does not change at all.
Because the web is built on this model, hex and RGB are interchangeable currency under the hood. Browsers treat them identically, and CSS lets you swap one for the other without changing a single pixel of what visitors see.
How the converter works
The conversion is mechanical, deterministic; there’s no guesswork involved:
- Strip the formatting. Leading hash marks (^) are stripped, spaces are removed and lowercase letters are not modified. The compact 3-digit short hand is also supported.
- Expand shorthand. A 3 digit code such as 09c is doubled per channel to 0099cc, a trick which CSS has been supporting for years, and which is commonly used to avoid large markup.
- Split into channels. The six remaining characters are cut into red, green,,and blue pairs.
- Convert pairs to decimal. Each pair is read as base-16: 12 × 16 + ️15 = ️ ️207, for example, and the integer lands betwee 0 and 255.
- Render the result. The tool shows the three decimal numbers, a swatch with the exact colour the same swatch that can be pasted as a CSS string.
How and when it may be needed.
- Interpretation of a brand palette. Clients give you a logo PDF from which you get hex codes, and your CSS/design program requires rgb() (or the new space-separated rgb syntax). This converter fills the gap in one paste.
- Working in design-to-code handoff. Colors are frequently different across Figma, Sketch, and Adobe XD, and your code base expects a different color. If you convert on the fly you have to ensure that the implementation remains faithful to the design.
- Removing the alpha or opacity properties from math. If you’re in need of rgb values with alpha transparency from a solid hex brand color, say for a 80% overlay on a hero section, the math will be much simpler if the basic RGB triplet is available.
- Checking contrast and accessibility. Numerical expressions of colour are often the first step in many contrast checking workflows, and the RGB triplets are directly fed into WCAG relative-luminance formulas.
- To teach or learn colour science. Students who first see hexadecimal will appreciate the double rendering of the same color; it is good to make the base-16 concept real and not abstract.
Color codes: Pro tips for working with them
- Memorize the 3-digit shorthand rules: There are a lot of UI situations that could be handled with #fff, #000, #09c, and #099. Knowing shorthand and being able to read (and hand write) many colors is a sighting without a tool.
- Learn the key hex values: #ffffff (white), #000000 (black), #ff0000 (red), #00ff00 (green), #0000ff (blue), and #808080 (gray) anchor your mental map of the color cube and make estimation far easier.
- Use the eyedropper of the browser: DevTools allows you to sample any color that appears on the screen and will display the color’s hex and rgb() representation. A quick way to check what a converter should create — plus a great second opinion if a color is wrong.
- Watch out for alpha: Alpha (transparency) is not included in the standard hex, only in an 8-digit hex such as #3498dbb2 which doesn’t convert cleanly in a 6-digit tool. The first 6 digits are for opacity; if you need opacity then convert the first 6 digits and use rgba() in your CSS to handle it separately.
- Use lowercase for new code: A lowercase hex string is slightly more readable by grep, and doesn’t create the visual clutter that happens with uppercase in long stylesheets. Most linters and formatters will enforce one case anyway – set all of them to lowercase, and the tool will handle the case for you.
Related Tool
HEX to RGB converter FAQ
What is the manual conversion of hex to rgb?
Divide the 6 digit code into 3 pairs of two digits each for each channel. Change each of the following pairs to base 10: A=10, B=11, … F=15; A*16 plus the next digit. For #3498db that gives 52, 152, 219 — so the rgb() value is rgb(52, 152, 219).
What is Hex vs RGB?
Only notation. Hex is red, green, and blue, represented as pairs of base-16 digits (00–ff), whereas RGB represents red, green, and blue, using decimal numbers (0–255). They are handled the same way by all browsers and neither is “more correct” — hex is more space-efficient and is easier to copy from the design tools, while rgb() reads easily for humans, and can include an optional alpha channel in rgba().
Is it possible to change RGB to HEX in this spot?
Not yet — this page has only one direction of conversion. If you’re switching back and forth between RGB and HEX notation a lot, this site has an accompanying RGB to HEX converter. It can also handle 3 digit shorthand (349 = #349) and hex without the # (334499 = #334499), so that you are able to use it with the 3-digit shorthand and hex you will encounter most frequently.
What is the sequence of each hex pair?
There are three color channels (RGB) and each pair handles one channel. The first pair is red (RR), the second pair is green (GG), and the third pair is blue (BB). The value of 00 is fully off and ff (255) is fully on. Combining the three channels according to the RGB model makes up the 16.7 million colors that modern displays are able to present.
Why is #ff0000 the color red and not the color ff?
If the red value is the highest, the first channel will be ff (255), and the others will have a value of 00: The color of a hex value is actually the sum of the channels. #ffff00 is a combination of full red and full green and no blue, which results in yellow. After you’ve thought in channels, hex codes are no longer random tokens, but predictable combinations that you can reason about.
Last updated: September ️9, 2026
Disclaimer - This HEX to RGB converter is provided as-is for convenience and educational purposes. Color values are computed automatically with standard base-16 conversion and should be verified before use in production design systems or brand assets. We are not responsible for color-matching discrepancies across monitors or print workflows.
Calculators | Converters | Games | Generators | Random | Web Tools | Developer Tools