Advertisements

header • up to 320x100 / 728x90

RGB to HEX

Convert RGB color to HEX

RGB to HEX

Use a proper RGB field plus a live swatch instead of a freeform textarea.

Working color
Use a color-aware form instead of a generic input/output template.
Swatch
Result
The tool-specific output stays visible together with derived color formats.
Waiting for a valid color value...
HEX
#4F46E5
RGB
rgb(79, 70, 229)
HSL
hsl(243, 75%, 59%)
HSV
hsv(243, 69%, 90%)
CMYK
cmyk(66%, 69%, 0%, 10%)
OKLCH
Unavailable
Palette preview
Advertisements

content bottom • up to 300x250

What is RGB to HEX

Last reviewed:

RGB (Red, Green, Blue) is the additive color model used by digital screens, mixing light to create every visible on-screen color.

RGB to HEX Converter takes an rgb() or rgba() color value with 0–255 channel integers (or 0–1 normalized floats) and returns the equivalent 6-digit hex code. When an alpha channel is present, the output is an 8-digit hex including the alpha byte.

The tool accepts both the legacy comma-separated syntax (rgb(255, 128, 64)) and the modern space-separated syntax (rgb(255 128 64)), and understands percentage inputs (rgb(100%, 50%, 25%)).

Why use it

  • Ship a design-token export (hex) from a runtime-generated RGB value in a framework like Tailwind or styled-components.
  • Normalize legacy rgb()-heavy stylesheets into hex for a compact, readable brand palette file.
  • Convert color picker output in tools like Chrome DevTools or Figma into the hex format your documentation expects.

Features

  • Accepts comma or space-separated rgb()/rgba() syntax as well as bare triples (255,128,64)
  • Supports percentage inputs (rgb(100%, 50%, 25%)) — percentages are mapped to the 0–255 range
  • Emits 8-digit hex with the alpha byte when an alpha channel is provided
  • Always lowercases the hex output (configurable to uppercase for specific brand style guides)
  • Batch mode: paste multiple rgb() values at once and get one hex code per line back

How to use RGB to HEX

  1. Paste RGB values. Type rgb(255, 128, 64), rgb(255 128 64), rgba(255, 128, 64, 0.5), or just 255,128,64 — the parser is permissive.
  2. Read the hex output. The converted hex appears live alongside a color swatch. 8-digit hex is emitted when the alpha channel is present.
  3. Copy and paste into CSS. Click copy on the hex field. The result is ready to drop into a CSS variable, a Tailwind theme extension, or a brand guideline document.
  4. Convert a batch. Open Batch mode, paste a newline-separated list of rgb() values, and download a CSV of matched hex codes for a design-token export.

Example (before/after)

RGB input

Paste your RGB input so it can be converted into HEX for your next step.

HEX output

Get HEX output converted from RGB that is ready to review, copy, or export into the next step of your workflow.

Common errors

Source format does not match the tool

Conversions fail when the pasted input is not actually in the expected source format.

Fix: Verify the source format first, then paste it into the correct converter.

Partial or inconsistent data

Broken rows, missing fields, or incomplete markup can block conversion.

Fix: Use a complete input sample with the structure intact before converting it.

Unexpected output assumptions

Different target formats can flatten, restructure, or serialize values differently.

Fix: Review the converted output and confirm it matches the target system before using it downstream.

FAQ

Will RGB to HEX emit an 8-digit hex when my input has alpha?

Yes. rgba(255, 128, 64, 0.5) becomes #ff804080 — the alpha float is multiplied by 255 and emitted as the last byte. For rgba with alpha 1 (or rgb with no alpha), the output is the standard 6-digit hex form.

What happens if my RGB values use percentages instead of 0–255 integers?

Percentages are mapped to the 0–255 range — rgb(100%, 50%, 25%) becomes rgb(255, 128, 64), which then converts to #ff8040. The tool handles both input forms interchangeably.

Are RGB values outside 0–255 accepted?

No — channels must be in the 0–255 range (or 0–100% for percentages, or 0–1 for normalized floats). Values above the max are clipped with a visible warning; negative values are rejected because they have no meaningful hex representation.

Is the hex output uppercase or lowercase?

Lowercase by default (matches the dominant convention in Tailwind, modern design systems, and most CSS-in-JS libraries). A toggle in the UI switches to uppercase for projects whose brand guidelines mandate it.

Can I paste the output from a Chrome DevTools color picker?

Yes. DevTools emits rgba(r, g, b, a) as its default RGB format, which is exactly what the converter expects. Paste the string as-is — no trimming needed.

Why does my RGB value convert to a hex shorter than I expected?

If all three channel pairs repeat their first digit (e.g. #ff6644 → all high-high repeating), some CSS tools shorten to 3-digit form (#f64). Our converter always emits the full 6-digit form for unambiguous copy-paste; you can post-process with a separate 'hex shorthand' tool if you need the compressed form.

Related tools

Continue the workflow with related tools for rGB to HEX, adjacent input and output steps, or other utilities in the same category. You can also browse the full Color Converters category for more options.

HEX to RGB

Convert HEX color to RGB

RGB to HSL

Convert RGB color to HSL

RGB to HSV

Convert RGB color to HSV

RGB to CMYK

Convert RGB color to CMYK

HEX to HSL

Convert HEX color to HSL

HEX to HSV

Convert HEX color to HSV

HSL to HEX

Convert HSL color to HEX

HSL to RGB

Convert HSL color to RGB

HSV to HEX

Convert HSV color to HEX

HSV to RGB

Convert HSV color to RGB

CMYK to HEX

Convert CMYK color to HEX

CMYK to RGB

Convert CMYK color to RGB