RGB to Hexadecimal

Convert RGB to HEX

RGB to HEX conversion encodes Red, Green, Blue channel values (0-255) into a compact 6-digit hexadecimal string for CSS, HTML, SVG, and design tools. Adjust the R, G, B sliders and get the HEX code in real time. This free converter outputs the # prefixed code ready to paste into any stylesheet or color picker.

Encode RGB to HEX
INPUT

Enter RGB Values

HSL239°, 84%, 67%
CMYK59%, 58%, 0%, 5%
RESULT

HEX Color Code

HEX CODE

#6366F1

RGB(99, 102, 241)

All Formats

Copied!
WHY CONVERT

Why Developers Convert RGB to HEX

4 reasons HEX is the preferred color notation in web development

Compact Syntax

HEX (#6366F1) is 7 characters including the hash. RGB (rgb(99, 102, 241)) is 20 characters. For large stylesheets with hundreds of color references, HEX saves significant file size and improves readability.

Universal Support

Every browser, email client, design tool, and CMS supports HEX. It is the most universally recognized color notation in digital design — from Figma to WordPress to HTML email templates.

Easy Copy-Paste

Color pickers in Figma, Sketch, and browser dev tools output HEX by default. Copying a HEX code from a design tool and pasting it into CSS is a single-step workflow with no reformatting.

Brand Guide Standard

Brand style guides list HEX codes as the primary digital color specification. Converting RGB values from design software to HEX ensures your deliverables match the brand documentation format.

NUMBER SYSTEM

The Hexadecimal Number System

Base-16 counting explained in 60 seconds

Decimal (base-10)Hexadecimal (base-16)Binary (base-2)
000000
991001
10A1010
15F1111
996301100011
255FF11111111

Hexadecimal uses 16 symbols: 0-9 and A-F. Each HEX digit represents 4 binary bits, so a 2-digit HEX pair represents exactly 1 byte (8 bits) — giving 256 values per color channel. This maps perfectly to the 0-255 range of each RGB channel.

CSS

RGB to HEX in Stylesheets

How to use the converted HEX code in your CSS

01

Get HEX from RGB

Enter your R, G, B values in the sliders above. The converter instantly generates the 6-digit HEX code. Click "Copy HEX" to save it to your clipboard.

02

Paste into CSS

Use the HEX code in any CSS property: color: #6366F1;, background-color: #6366F1;, border-color: #6366F1;, or as a CSS variable: --primary: #6366F1;.

03

Verify in Browser

Open DevTools (F12), inspect the element, and verify the computed color matches your intent. The browser renders HEX and RGB identically — use whichever is easier for your team to maintain.

TIP

Shorthand HEX Codes

When 3 characters are enough

CSS supports 3-digit shorthand HEX codes when each channel pair consists of identical digits. #FF0000 shortens to #F00, #336699 shortens to #369, and #FFFFFF shortens to #FFF. The browser expands each digit by doubling it: #F00 becomes #FF0000.

Shorthand only works when both digits in each pair match. #6366F1 cannot be shortened because 63 ≠ 66 ≠ F1. Our converter outputs the full 6-digit HEX code and indicates when a shorthand version is available.

In production CSS, use shorthand when possible to reduce file size. For CSS minification tools, this optimization happens automatically — the minifier replaces 6-digit HEX with 3-digit shorthand wherever valid.

#F00
#0F0
#369
#FFF
#000
FAQ

RGB to HEX — Frequently Asked Questions

Convert each channel (R, G, B) from base-10 to base-16. R=99 → 63, G=102 → 66, B=241 → F1. Concatenate: #6366F1. Our converter does this automatically.

No. RGB(99, 102, 241) and #6366F1 are two ways to write the same color. Browsers render them identically. The conversion is purely mathematical — lossless with zero visual change.

Add 2 extra HEX digits for alpha: #6366F180 (50% opacity). Or use rgba(99, 102, 241, 0.5). Modern CSS also supports rgb(99 102 241 / 50%) syntax.

HEX is shorter and more common. RGB is better when you need alpha transparency or want to store channel values separately for CSS custom properties. Both render identically.

Yes. Open the Photoshop Color Picker, read the R, G, B values, and enter them in our converter. Photoshop already shows HEX in its color picker, but our tool provides additional formats like HSL and CMYK alongside the HEX code.

Yes. 100% free, unlimited conversions, no sign-up.