Color Picker
Pick colors visually and convert between HEX, RGB, HSL, and CMYK formats. Copy any format with a single click.
How to Use
Pick a Color
- Click or drag on the color square to select saturation and brightness
- Use the hue slider below to change the color hue
- See live preview in the color swatch
Convert Formats
- All formats update automatically as you pick colors
- Click the copy button next to any format
- Paste your own color in the input field to convert
Color History
- Your last 10 picked colors are saved automatically
- Click any historical color to restore it
- History persists across browser sessions
Supported Formats
- HEX: #ff5733
- RGB: rgb(255, 87, 51) or 255, 87, 51
- HSL: hsl(11°, 100%, 60%) or 11°, 100%, 60%
- CMYK: 0%, 66%, 80%, 0%
Color Format Conversions
Understanding different color formats helps you work across various design tools and platforms:
- HEX: Most common format for web design. Used in CSS, HTML, and most design software.
- RGB: Represents colors using Red, Green, and Blue values (0-255). Standard for screens and digital displays.
- HSL: Uses Hue, Saturation, and Lightness. More intuitive for creating color schemes and variations.
- CMYK: Used for print design. Represents Cyan, Magenta, Yellow, and Key (black) ink percentages.
Common Use Cases
- Web designers converting colors between design tools and CSS
- Developers extracting exact color codes from visual mockups
- Graphic designers preparing files for both screen and print
- Brand managers ensuring color consistency across platforms
- Digital artists creating harmonious color palettes
Tips & Tricks
- Use the color history to compare multiple color options side by side
- Paste colors from design tools (Figma, Sketch, etc.) directly into the input field
- Bookmark frequently used colors by keeping them in your history
- Use HSL format when creating tints and shades of the same hue
- Convert to CMYK before sending designs to professional printers