Color Converter Online — HEX, RGB, HSL, Contrast
Paste a color in any common notation — #ff6600, rgb(255, 102, 0), hsl(24, 100%, 50%) — and get every other format plus its WCAG contrast against white and black.
- 3-digit hex (#f60) and 8-digit hex with alpha are both accepted.
- The contrast numbers tell you which text color passes WCAG AA on this background.
- HSL is the format to reach for when adjusting lightness or building a palette.
Every conversion in this toolkit runs in your browser with the standard JS APIs. Your input is never uploaded, stored, or logged.
Which format for what
HEX is the interchange format: short, unambiguous, and what design tokens and CSS custom properties usually store. RGB maps directly to how screens mix light and is what image tooling reports. HSL is the one built for humans adjusting colors — change L to get a lighter or darker variant of the same hue, change S to mute it, and the hue stays put.
Alpha fits all three: 8-digit hex, rgba(), hsla(). The converter preserves alpha through every format and shows where it applies.
Contrast and accessibility
WCAG 2.x contrast is a ratio between text and background luminance: 4.5:1 for normal body text (AA), 3:1 for large text, 7:1 for AAA. The tool computes both directions — against white and against black — and tells you which passes. The quick reality check: mid-tone colors (yellows, light blues, grays) often pass neither, which is exactly when the numbers earn their place.
Contrast is not style politics; it is whether a meaningful part of your audience can read the text at all. Checking it takes seconds and the converter shows the verdict inline.
Frequently asked questions
Why do my RGB and HSL values differ slightly from another tool?
Rounding. This tool rounds HSL channels to integers and RGB channels to 0–255, the same convention as CSS. Tools that keep fractional precision can differ by ±1 in the last digit — visually identical.
What contrast ratio do I need?
WCAG AA requires 4.5:1 for normal text and 3:1 for large text (18pt+ or 14pt bold). AAA raises both to 7:1 and 4.5:1. The tool shows the exact ratio against white and black.
Does the converter upload my colors?
No. Everything runs in your browser — colors are computed locally with plain math.