1. Articles
  2. HEX to RGB Color Conversion: C...
HEX to RGB Color Conversion: Complete Guide

What Is HEX Color?

HEX color notation uses hexadecimal (base-16) numbers to express RGB values. Each pair of characters represents one channel (R, G, B) from 00 (0) to FF (255). Example: #FF5733 = R:255, G:87, B:51.

How to Convert HEX to RGB

  1. Split the HEX code into three pairs: FF, 57, 33
  2. Convert each pair from base-16 to base-10:
    • FF = 15×16 + 15 = 255
    • 57 = 5×16 + 7 = 87
    • 33 = 3×16 + 3 = 51
  3. Result: rgb(255, 87, 51)

How to Convert RGB to HEX

  1. Convert each channel value from decimal to hex:
    • 255 → FF
    • 87 → 57
    • 51 → 33
  2. Concatenate with # prefix: #FF5733

Shorthand HEX

When each pair is the same digit (e.g., #FFAABB), you can write a 3-digit shorthand: #FAB. Browsers expand this to #FFAABB. Only works when each channel pair is a doubled digit.

Skip the math — use the Color Picker for instant conversion.

Recommended Tool

Pixeliro

Production-Ready Color System Studio

Generate brand semantic palettes, validate contrast for accessibility, and export design tokens to any platform — all in one place.

🎨
AI Palette GeneratorGenerate brand semantic palettes with 46 semantic roles powered by AI
WCAG Contrast CheckerReal-time validation against WCAG 2.1 AA/AAA standards
🔗
Design Token ExportExport to CSS, Tailwind, Swift, Kotlin, JSON & Figma
🖼️
Image Palette ExtractionExtract beautiful color palettes from any image
Try Pixeliro FreeFree plan available — No credit card required
🎨Preview Image