Pick colors from anywhere on your screen and get HEX, RGB, HSL, and HSV values instantly. Use the built-in eyedropper to sample colors, explore a palette of nearby shades, and copy any color code with one click.
How to Use Color Picker
- 1Use the color wheel or sliders to choose a color, or click "Pick from Screen" for the eyedropper
- 2View HEX, RGB, HSL, and HSV values instantly as you adjust
- 3Click any color value to copy it to clipboard
- 4Explore the color palette for nearby shades and harmonious colors
- 5Use your chosen colors in the Gradient Playground to create CSS gradients
Features
- Interactive color wheel and sliders with real-time HEX, RGB, HSL, and HSV output
- Screen eyedropper using the EyeDropper API for sampling colors anywhere on your display
- One-click copy for any color format plus recent colors history
- Color palette generator shows nearby shades and harmonious colors for your selected hue
Frequently Asked Questions
What is the eyedropper tool?
The eyedropper lets you click anywhere on your screen to sample that color. It uses the browser's built-in EyeDropper API (Chrome 95+, Edge 95+).
Which browsers support the eyedropper?
Chrome 95+, Edge 95+, and Opera 81+ support the EyeDropper API. Firefox and Safari do not yet support it natively.
What's the difference between HEX, RGB, and HSL?
HEX is the web standard format (#RRGGBB). RGB expresses colors as red/green/blue components (0–255 each). HSL uses hue, saturation, and lightness — often easier for humans to reason about.