HEX ↔ RGB Color Converter

A hex code like 2f8f5c splits into three two-digit hex pairs — 2f, 8f, 5c — each converted from base 16 to base 10 to get red, green, and blue values, here 47, 143, 92. The shorthand three-digit form, like 2f8, expands by duplicating each digit rather than padding with zero, so 2f8 becomes 22ff88, not 20f080 — an easy mistake if you write the conversion by hand.

An eight-digit hex code appends a fourth byte for alpha, as in 2f8f5cff, while RGB expresses the same thing as a separate rgba() function with a 0-to-1 opacity value rather than a 0-to-255 byte. Mixing these up — treating the alpha byte as part of the color, or forgetting it's on a different numeric scale — produces colors that render correctly but composite wrong against a background.

Converting to RGB is usually the first step before computing relative luminance and contrast ratio for WCAG compliance checks, since the standard's math operates on linearized 0-to-1 RGB channels, not on hex strings. If your design system stores colors as hex, converting here before running a contrast check saves you from doing the base conversion by hand every time. WCAG AA requires a 4.5:1 contrast ratio for normal body text and 3:1 for large text, and that ratio is only meaningful once both foreground and background are expressed as the same RGB-derived luminance value, so skipping the conversion step and eyeballing two hex codes side by side is not a reliable substitute.

Neither HEX nor RGB directly expresses how a color would look lighter, darker, or more saturated, which is where HSL — hue, saturation, lightness — earns its place; nudging the lightness value up or down is a far more intuitive way to build a color palette than guessing which RGB channel to adjust. Converters that support all three formats side by side make it easy to pick a hue in HSL and then hand a designer the resulting hex value for a spec document.