Skip to content
Free ToolDesign

Convert HEX color codes to RGB and back

Type a HEX code like #FF5733 and instantly see the RGB equivalent — rgb(255, 87, 51). Or enter RGB values and get the HEX code. A live color swatch updates as you type, and one-click buttons copy the value in the format you need for CSS, design tools, or documentation.

Use this tool free

Features

1

Bidirectional conversion

Enter a HEX code to get RGB, or enter RGB values to get HEX. Both fields update in real time as you type, with no need to click a convert button.

2

Live color swatch

A large preview swatch displays the color you entered. It updates instantly so you can visually confirm the shade matches what you expect.

3

CSS output snippets

Get ready-to-paste CSS code for color, background-color, and border-color properties in both HEX and RGB formats. Copy any snippet with one click.

4

Alpha channel support

Enter 8-digit HEX codes or RGBA values to work with transparency. The tool converts the alpha channel accurately between the two formats.

How to use

1

Enter a color value

Type a HEX code (with or without the # symbol) or enter RGB values as three numbers from 0 to 255.

2

View the result

The opposite format field updates automatically. The preview swatch shows the color.

3

Copy

Click the copy button next to any value or CSS snippet. A toast confirms the text is on your clipboard.

Specifications

Input formatsHEX (3, 6, 8 digit), RGB, RGBA
Output formatsHEX, RGB, RGBA
Alpha supportYes (HEX8, RGBA)
CSS snippetscolor, background, border
PreviewLive swatch
ProcessingClient-side (instant)

Related Magic Eraser Tools

Common questions

What is the difference between 3-digit and 6-digit HEX codes?

+

A 3-digit HEX code like #F53 is shorthand for #FF5533 — each digit is doubled. The tool accepts both forms and always outputs the full 6-digit code for clarity.

Can I enter HEX codes without the # symbol?

+

Yes. The tool recognizes HEX values with or without the leading hash. It will add the # to the output automatically.

How do I convert a color with transparency?

+

Use an 8-digit HEX code where the last two digits represent alpha (for example #FF573380 for 50% opacity) or enter four RGBA values. The tool converts the alpha channel between both formats.

Working with brand colors in photos?

AI Enhance can adjust photo colors to match your brand palette. Get the exact RGB values here, then use them as a reference when enhancing product photography.

Try it free