Convert RGB to HEX
Convert CSS rgb(...) colors into clean HEX codes like #RRGGBB—fast, private, and right in your browser.
- Paste a single RGB color or a whole palette
- Use one color per line for batch conversion
- Copy your HEX results instantly
Quick start
- Paste your RGB color(s) into the input.
- Use one color per line.
- Copy the HEX results.
Single color
Input:
rgb(34, 211, 238)Output:
#22D3EEPalette / design tokens (batch)
Input:
rgb(255, 0, 85)
rgb(34, 211, 238)
rgb(17, 24, 39)Output:
#FF0055
#22D3EE
#111827What RGB means
RGB stands for Red, Green, Blue—the three light channels used by screens.
- Each channel is usually an integer from 0 to 255.
rgb(0, 0, 0)is black (no light).rgb(255, 255, 255)is white (full light).
RGB is the most common “screen-native” way to represent color, which is why you’ll see it in:
- CSS and browser APIs
- design tools that copy colors as
rgb(…) - canvas / image processing code
What HEX means
HEX is simply RGB written in hexadecimal (base‑16) as a compact code:
#RRGGBB
Each pair is one channel:
RR= redGG= greenBB= blue
Example:
rgb(255, 87, 51)→#FF5733
Because HEX is compact and stable, it’s widely used for:
- CSS variables and theme tokens
- Tailwind / design system configs
- storing palettes in JSON/YAML
- quick copy/paste across tools
How RGB → HEX conversion works
Conceptually, the converter does this for each line:
- Read the three RGB channel values (0–255)
- Convert each value to a 2-digit hex pair (00–FF)
- Join them into
#RRGGBB
A small example:
- Red = 34 →
22 - Green = 211 →
D3 - Blue = 238 →
EE
So rgb(34, 211, 238) becomes #22D3EE.
Common mistakes (and quick fixes)
Extra spaces at the start/end of a line
This variant does not trim lines.
If a line has extra whitespace, try removing it:
✅ rgb(255, 0, 85)
🚫 rgb(255, 0, 85)
Missing “rgb( … )” wrapper
Make sure each line is a full CSS-style RGB string:
✅ rgb(17, 24, 39)
🚫 17, 24, 39
Values outside 0–255
RGB channels should stay in range:
✅ rgb(0, 128, 255)
🚫 rgb(300, -5, 260)
Practical uses
- Convert design-tool exports (often given as
rgb(…)) into HEX for CSS - Normalize palettes into
#RRGGBBfor brand guidelines - Create design tokens for theming systems
- Make Tailwind-friendly values for config files or docs
If you’re working with UI colors, HEX is often the most portable format for CSS, design tokens, and documentation.
