How to pick a color from an image
- Click Choose an image, drop one onto the box, or paste a screenshot.
- Move over the picture to see a magnified view of the pixels under the pointer, then click to pick that color.
- Click the HEX, RGB or HSL value to copy it. The image’s main colors are listed with their share; click one to select it, or Copy all to get the whole list.
HEX, RGB and HSL
All three describe the same color in different ways:
- HEX (#3A7BD5) is the short code used in CSS, design tools and brand guides.
- RGB (rgb(58, 123, 213)) gives the red, green and blue amounts from 0 to 255.
- HSL (hsl(215, 65%, 53%)) gives hue, saturation and lightness, which makes it easy to make a color lighter or darker by changing one number.
To convert a color between these and other formats, use the color converter.
Getting a palette from a photo
The main colors list is a quick way to build a color scheme from a picture you like: a landscape, a product photo, a room. Copy all gives the HEX codes as a comma-separated list you can paste into notes or a design tool. The percentages show which colors dominate, which helps decide which one to use for backgrounds and which for accents.
Photos with lots of small details can produce muddy averages. If a color you want isn’t in the list, pick it by hand from the picture. To build matching schemes from scratch, try the color palette generator.