Color Picker & Converter
Pick a color or enter a value in any format — HEX, RGB, or HSL — and instantly convert between them.
Everything runs locally in your browser. Click any copy button to grab the color code.
Pick color
How to Convert HEX to RGB
A HEX color code like #FF5733 is a six-digit hexadecimal number where each pair of digits
represents one color channel: red, green, and blue. To convert, split the code into pairs (FF, 57, 33)
and convert each from base-16 to base-10. So FF = 255, 57 = 87, 33 = 51, giving you
rgb(255, 87, 51). This tool does the conversion instantly as you type or pick a color.
Understanding HSL Color Values
HSL stands for Hue, Saturation, and Lightness. Hue is the color angle on a 360-degree wheel (0° = red,
120° = green, 240° = blue). Saturation controls how vivid the color is (0% = gray, 100% = full color).
Lightness sets brightness (0% = black, 50% = pure color, 100% = white). Designers often prefer HSL
because adjusting a shade or tint means changing a single value instead of recalculating all three RGB channels.
When to Use Each Color Format
Use HEX codes in CSS for brevity (#3b82f6). Use RGB when you need alpha transparency
(rgba(59, 130, 246, 0.5)) or when working with JavaScript canvas APIs. Choose HSL when
designing color palettes — it’s easy to create harmonious colors by rotating the hue while keeping
saturation and lightness constant. This converter lets you work in whichever format is most natural
and grab the others instantly.