From inspiration to CSS
Use a photo, logo, game board or marketing image as inspiration, then copy the extracted colours directly into a design system. CSS export creates variables such as --palette-1, --palette-2 and so on.
Find the colours.
Build the palette.
Drop in an image and pull out its dominant colours with HEX, RGB and HSL values. Copy individual colours or export the whole palette.
● Image analysis stays on your deviceHow it works: the image is reduced to a working sample and colours are quantized into buckets. Nearby dominant buckets are merged so the palette is more useful than simply listing thousands of nearly identical pixel colours.
Dominant does not mean exact brand colour
The extractor groups sampled colours to find visually dominant families. If you need the exact colour of a specific pixel or official brand value, a dedicated colour picker or the original design specification is more appropriate.