Convert between hex, RGB, and HSL color formats. Live preview, contrast checker, and CSS code — all in your browser.
Client-Side Only
•
Live Preview
Pick a color
CSS Values
—
—
—
Contrast Ratio (WCAG)
vs White (#FFF)
—
vs Black (#000)
—
Frequently Asked Questions
How do I convert a hex color to RGB?
Enter a hex color code (e.g., #FF5733) and the tool instantly shows RGB values (255, 87, 51). Each pair of hex digits represents one color channel: RR=red, GG=green, BB=blue. The conversion is: decimal_value = parseInt(hex_pair, 16).
What is the difference between hex and RGB color formats?
Hex colors use base-16 notation (#RRGGBB) — compact and widely used in CSS/HTML. RGB uses decimal values 0-255 for each channel — easier to read and adjust. HSL uses hue (0-360°), saturation (0-100%), and lightness (0-100%) — most intuitive for color picking. All three represent the same colors.
Do I need to include the # symbol?
No. Both "FF5733" and "#FF5733" are accepted. The tool also supports 3-digit shorthand (#F53 expands to #FF5533) and 8-digit hex with alpha (#FF573380).
What is HSL color format?
HSL stands for Hue, Saturation, Lightness. Hue is the color angle (0°=red, 120°=green, 240°=blue). Saturation is color intensity (0%=gray, 100%=vivid). Lightness is brightness (0%=black, 50%=pure color, 100%=white). It's the most intuitive format for adjusting colors.