Skip to content

HEX to RGB Color Converter

Free

Convert any HEX color code to RGB values instantly. Enter #FF5733, get RGB(255, 87, 51). Free, browser-based, no signup required.

hex color to rgbconvert hex to rgb online#hex to rgb
All Color Tools

Settings guide

HEX format reference:

FormatExampleNotes
6-digit#FF5733Standard. Each pair = one channel (00–FF).
3-digit shorthand#F53Expands to #FF5533. Only valid when each digit doubles.
8-digit with alpha#FF573380Last pair = alpha (00 = transparent, FF = opaque).

Reading HEX digits:

  • ·Each HEX pair ranges from 00 (decimal 0) to FF (decimal 255).
  • ·To convert manually: multiply the first digit by 16, add the second digit. E.g. FF = 15×16 + 15 = 255.
  • ·Common values: 00=0, 80=128, CC=204, FF=255.

When to use RGB over HEX in CSS:

  • ·rgba() for opacity: rgba(255, 87, 51, 0.5) — easier to read than 8-digit HEX.
  • ·CSS custom properties that need channel separation: --color-r: 255; --color-g: 87;
  • ·JavaScript Canvas API: ctx.fillStyle = rgb(${r}, ${g}, ${b})``.

Format comparison

HEX vs RGB in CSS: Both work identically — browsers parse them to the same internal representation. HEX is shorter for opaque colors (#FF5733 vs rgb(255, 87, 51)). RGB is clearer for semi-transparent values (rgba(255, 87, 51, 0.5) vs #FF57337F — the alpha is obvious in rgba).

HEX vs HSL: Neither is universally better. HEX/RGB maps directly to screen hardware. HSL is easier for humans to adjust — change the L (lightness) value to lighten or darken without touching hue. Pick HEX for copying from design tools; HSL for programmatic color manipulation.

HEX vs OKLCH (modern CSS): OKLCH is perceptually uniform — equal numerical steps produce equal-looking lightness changes. HEX/RGB are not perceptually uniform. For design systems being built in 2025+, OKLCH is worth learning. For compatibility-sensitive projects, HEX and RGB remain the safe choice.

How it works

1

Enter HEX

Type or paste your HEX code — with or without the # prefix. Supports 3-digit, 6-digit, and 8-digit (alpha) formats.

2

Convert

The tool splits the HEX string into pairs, converts each from base-16 to decimal, and displays the RGB values.

3

Copy

Click any output format to copy it — rgb(), rgba(), or individual R/G/B values.

About this format

HEX and RGB represent the same colors — they are two different notations for the same underlying data. A HEX code like #FF5733 encodes three 8-bit values (Red, Green, Blue) as pairs of hexadecimal digits. FF is 255 in decimal, 57 is 87, and 33 is 51. The RGB equivalent is therefore rgb(255, 87, 51).

You need this conversion when your design tool gives you a HEX value but your CSS framework, canvas API, or programming library expects RGB integers. JavaScript's Canvas API uses separate R, G, B parameters. Many animation libraries accept RGB triplets. Some design tokens systems store colors as integer arrays. HEX works perfectly in CSS but not everywhere else.

The 3-digit HEX shorthand (#F53) expands to 6 digits by doubling each character (#FF5533). 8-digit HEX (#FF573380) adds an alpha channel as the last pair — 80 hex is 128 decimal, meaning 50% opacity. This converter handles all three forms and shows the RGBA equivalent when an alpha channel is present.

Frequently asked questions

How do I convert HEX to RGB manually?+
Split the HEX code into three pairs (RR, GG, BB). Convert each pair from hexadecimal to decimal: multiply the first digit by 16 and add the second digit. #FF5733 → FF=255, 57=87, 33=51 → RGB(255, 87, 51).
What does the # symbol mean in a HEX color?+
The # is just a prefix indicating that what follows is a hexadecimal color code. It is required in CSS but some tools and APIs accept the code without it (e.g., FF5733 instead of #FF5733).
How do I convert a 3-digit HEX shorthand to RGB?+
Expand each digit by doubling it first. #F53 becomes #FF5533, then convert normally: FF=255, 55=85, 33=51 → RGB(255, 85, 51). Shorthand only works when both digits of each pair are identical.
What is the difference between RGB and RGBA?+
RGBA adds a fourth Alpha channel that controls opacity. RGB values range from 0 to 255; Alpha ranges from 0 (fully transparent) to 1 (fully opaque) in CSS, or 0 to 255 in some APIs. rgba(255, 87, 51, 0.5) is 50% transparent orange-red.
Can I convert an 8-digit HEX (with alpha) to RGBA?+
Yes. The 8-digit format is #RRGGBBAA where the last pair is the alpha channel in hex. Convert the last pair to decimal and divide by 255 for the CSS alpha value. #FF573380 → alpha: 128/255 ≈ 0.50, so rgba(255, 87, 51, 0.50).
Why does my RGB value look different from the color I see on screen?+
Your monitor applies a color profile (usually sRGB) that affects how RGB values are rendered. Two monitors with different calibrations will show the same RGB value slightly differently. If color accuracy matters, work in a calibrated environment and use a color-managed workflow.

Related tools and guides