PocketPlay
中文
Image Color Palette
Pull the dominant colours out of any photo with median-cut or k-means, copy HEX, RGB and HSL, pick colours with an eyedropper and export CSS variables or JSON.
Click anywhere on the image to sample that exact pixel.
Palette
Add an image to extract its colours.
Click a swatch to copy its HEX. Click a value to copy that format.
How to get a colour palette from an image
- Drop a photo, screenshot or illustration into the box — it is analysed entirely in your browser.
- Choose how many colours you want (5–12) and whether to use median cut (fast, faithful to the image) or k-means (smoother, more averaged clusters), then click Extract palette.
- Click any swatch to copy its HEX, click on the image itself to sample an exact pixel, or export the whole palette as CSS variables, SCSS, JSON or a PNG.
FAQ
What is the difference between median cut and k-means?
Median cut repeatedly splits the colour cube along its widest axis, so it keeps distinct, punchy colours even when they cover a small area. K-means groups pixels around moving centroids, giving softer averages that represent large areas more faithfully.
Why is my palette mostly grey?
Photos often have huge neutral areas — sky, walls, paper. Turn on Ignore near-white and near-black to drop those pixels and surface the actual accent colours.
What is the "share" percentage?
The proportion of sampled pixels assigned to that colour cluster. It tells you which colour dominates the image, which is what you usually want as a background rather than an accent.