Hex to RGB Converter

Convert hex color codes to RGB values instantly. Also outputs HSL and CSS-ready color values for designers and developers.

ยท CalcFlow Editorial

Enter the 6-digit hex color code as a number (without #). For example, FF6B35 = 16737077 in decimal. Or see the FAQ for how to use this.

Set to 0 to use hex input above. Set a value to build RGB directly.

Enter values above and click Calculate to see your results.

Results shown are estimates for informational purposes only. Nothing on CalcFlow is financial, tax, legal, or medical advice. Always consult a qualified professional before making important decisions.

What is a Hex to RGB Converter? A hex to RGB converter translates a 6-digit hexadecimal color code (like #FF6B35) into three decimal channel values for Red, Green, and Blue (0-255 each).

๐Ÿ’ก

Rule of Thumb

#000000 = black (0,0,0) | #FFFFFF = white (255,255,255) | #FF0000 = pure red | #00FF00 = pure green | #0000FF = pure blue.

๐Ÿ“Š

Example Calculation

#FF6B35 converts to R:255, G:107, B:53 โ€” an orange tone. In CSS: rgb(255, 107, 53) or hsl(20, 100%, 60%).

Key Facts

  • โ€ขHex codes use base-16: digits 0-9 and letters A-F. Each pair of characters represents one 8-bit color channel.
  • โ€ขThe first two hex digits = Red, middle two = Green, last two = Blue.
  • โ€ขWCAG AA accessibility requires 4.5:1 contrast ratio for normal text against the background color.

How to Use

  1. To convert a hex code: enter the 6-digit hex value as a decimal number (e.g. #FF6B35 = 16737077), leave RGB fields at 0.
  2. To convert RGB to hex: enter 0 in the hex field and set Red, Green, and Blue channel values.
  3. Click Calculate to see hex, RGB, HSL, and CSS values.
  4. Use the Accessibility result to check if text will be readable on this background color.

Formula

R = (hex >> 16) & 0xFF | G = (hex >> 8) & 0xFF | B = hex & 0xFF | HSL conversion via standard formula
Color NameHex CodeRGB Values
Black#000000rgb(0, 0, 0)
White#FFFFFFrgb(255, 255, 255)
Red#FF0000rgb(255, 0, 0)
Green#00FF00rgb(0, 255, 0)
Blue#0000FFrgb(0, 0, 255)
Orange#FF6B35rgb(255, 107, 53)
Teal#0F766Ergb(15, 118, 110)
Gray#6B7280rgb(107, 114, 128)

Frequently Asked Questions

Q

How do I convert a hex color code to decimal for this calculator?

Open your browser console (F12) and type: parseInt("FF6B35", 16) โ€” it will output the decimal number (16737077). You can also use Windows Calculator in Programmer mode: switch to Hex, type FF6B35, then switch to Dec.
Q

What is the difference between RGB and HSL?

RGB (Red, Green, Blue) uses three channel values (0-255) to define a color by how much of each light channel to mix. HSL (Hue, Saturation, Lightness) describes color by its position on the color wheel (0-360 degrees), how saturated it is, and how light or dark it is. Designers often prefer HSL because adjusting lightness alone does not shift the hue.
Q

What is WCAG contrast ratio?

WCAG (Web Content Accessibility Guidelines) requires a contrast ratio of at least 4.5:1 between text and its background for normal body text (Level AA). High-contrast designs use 7:1 (Level AAA). This calculator checks whether white or black text would pass AA on this color as a background.
Q

Can I use the output directly in CSS?

Yes. The RGB output (e.g. rgb(255, 107, 53)) and HSL output (e.g. hsl(20, 100%, 60%)) can be pasted directly into any CSS color property. Use rgba(255, 107, 53, 0.8) for semi-transparent versions.