Color Picker
Interactive color picker tool that allows you to select colors visually and convert between different color formats including HEX, RGB, HSL, and HSV. Perfect for web development, design work, and color scheme creation.
Color Picker
Color Values
rgb(59, 130, 246)hsl(217, 91%, 60%)Color Preview
#3b82f6rgb(59, 130, 246)hsl(217, 91%, 60%)When to use this tool
You need to translate between HEX, RGB, and HSL values quickly.
You want to verify a color visually while adjusting values.
Examples
Hex to RGB
Input
#0a84ff
Output
rgb(10, 132, 255)
Great for converting design colors into CSS values.
Developer use cases
Match design tokens to CSS color variables.
Sample a brand color and convert it to HSL for theming.
Common mistakes to avoid
Mixing up hex shorthand (#abc) with full hex values (#aabbcc).
Assuming HSL lightness equals perceived brightness.
Format and behavior notes
HEX uses base-16; RGB uses 0-255 per channel.
HSL uses hue (0-360), saturation and lightness (0-100%).
Frequently Asked Questions
How do I use the color picker?
Click on the color wheel or use the sliders to select a color. The tool will automatically show the color in HEX, RGB, and HSL formats.
Can I convert between color formats?
Yes, you can input a color in any format (HEX, RGB, HSL) and the tool will convert it to all other formats automatically.
Can I copy the color values?
Yes, click the copy button next to any color format to copy that value to your clipboard.