Skip to content
Webmaster Tools
CSS & designColor Converter

HEX to RGB Color Converter

HEX, RGB and HSL.

Color
Accepts rgb(), hsl(), hex and named colors. Press Enter to apply.
contrast on white ·
contrast on black ·
CSS

About the Color Converter

This tool converts a color between hex, RGB and HSL and keeps all three in sync. You can enter a value in any field: a hex code with 3, 4, 6 or 8 digits (the last two digits of an 8-digit code are alpha), RGB channels from 0 to 255, HSL as degrees and percentages, or an alpha value from 0 to 1. The Any CSS color field accepts rgb(), hsl(), hex and named colors like tomato, parsed by the browser's own CSS engine.

You also get a swatch, six tints of the same hue, and the contrast ratio against white and black with its WCAG 2 rating (AAA, AA, AA large text or fails AA). The CSS panel gives ready-to-copy hex, rgb() and hsl() values, switching to rgba(), hsla() and 8-digit hex when alpha is below 1, plus a --color custom property.

How to use it

  1. Type a hex code, adjust R, G, B or H, S, L, or pick a color with the picker.
  2. For other CSS syntax, type it in Any CSS color and press Enter.
  3. Click a tint to use it, and check the contrast ratings.
  4. Copy the line of CSS you need.

Examples

Common questions

How do I convert hex to RGB by hand?

Split the six digits into three pairs and read each pair as a base-16 number: #2f6fed is 2f = 47, 6f = 111, ed = 237.

What contrast ratio do I need for text?

WCAG 2 level AA requires 4.5:1 for normal text and 3:1 for large text; level AAA requires 7:1 for normal text.