Image color picker - extract a color palette from any image
Drop an image, paste, or upload
PNG · JPEG · WebP · GIF — stays in your browser
No image? Try a sample
Extract a color palette from any image
Upload a photo, screenshot, logo or piece of art and UIshades pulls out its colors - up to eight dominant tones, ranked by how much of the image they cover. Every color is a real pixel marked by a circle on the image, so you can see exactly where it came from and drag it to fine-tune. Click anywhere on the image to pick another color, then turn any of them into a full OKLCH ramp or Tailwind scale. The image stays on your device - nothing is uploaded.
How it works
- 1. Upload. Drop, paste, or choose an image (PNG, JPEG, WebP, GIF).
- 2. Review. Up to 8 dominant colors appear, each with a circle on the image.
- 3. Fine-tune. Drag a circle to change its color, or click the image to add one.
- 4. Export. Pick a color for its ramp and exports, download a PNG, or save the palette.
Frequently asked questions
- Is my image uploaded to a server?
- No. The image is read and analyzed entirely in your browser. Nothing is sent to or stored on a server, which also means a result is not shareable and is lost when you reload the page.
- How many colors can I extract?
- Up to 8. Simple images return fewer - a two-color logo yields about two colors - while photos fill all eight. You can remove colors and add your own by clicking the image.
- How are the colors chosen?
- A median-cut algorithm finds the most dominant color regions, ranked by how much of the image each covers. Every swatch is a real pixel from the image, marked by a circle you can drag to change the color.
- What image formats are supported?
- PNG, JPEG, WebP and GIF. Large images are scaled down for fast analysis; the colors you get are unaffected.
- Can I turn an extracted color into shades?
- Yes. Click any color in the palette to generate its full OKLCH tint-to-shade ramp or an 11-stop Tailwind scale, with copy-ready exports for Tailwind, CSS variables, W3C design tokens and Figma.