One image,
one unique palette!
We built the free Vivlab color generator to help you create harmonious color palettes from any image, like your logo for example.
Just upload the image file of your choice to generate a palette. You can then pull the exact color codes (HEX format) to use when building your web pages or any other marketing material.
Not happy with the palette you got? Try another image!
Image to work from
Your generated color shades
Click a color to copy its HEX code.
How it works
Extract a palette in 3 steps
Upload an image
Drag a file into the box or click to load a logo, a photo or a screenshot.
Let it read the colours
The tool shrinks the image and groups nearby colours to surface the three shades that come up most.
Copy a code
Click a swatch to copy its HEX code, ready to paste into your design tool or your CSS.
Picking the right palette
What is a palette?
A color palette brings together the few shades that define the visual identity of a brand or a site. Choosing consistent, harmonious colors makes your communication instantly recognizable and more professional.
Pulling the HEX codes
The tool reads the dominant colors in your image and builds a full range from them. Each shade comes with its HEX code (for example #4B3FD9), the universal format you can reuse across your web pages, your visuals or your documents.
How does it work?
Upload an image, your logo for instance: the generator spots the colors that show up most, then creates a range for each one from light to dark. All that's left is to click a shade and copy its code.
The Vivlab tip
Always test your palette on a light background and a dark one: a color can read perfectly in one case and vanish in the other. Checking that contrast keeps your brand consistent everywhere you use it.
Frequently asked questions
Your questions about palettes
How does the tool pick the colours?
It shrinks the image to a small grid, sorts each pixel into a colour bucket, then keeps the three busiest buckets while skipping pure white. You get the shades that actually carry the image, not a muddy average.
Why nine shades per colour?
Each base colour is spread from lightest to darkest, with the pure colour sitting in the middle. That range lets you choose a background, a text colour and a hover state that stay consistent together.
Is my image sent to a server?
No, everything runs in your browser. The pixels are read on a local canvas, and the file never leaves your computer.
Which image formats can I load?
Any the browser can open: PNG, JPG, WebP, GIF or SVG. A sharp, well-contrasted image gives cleaner shades than a very dark or washed-out photo.
Can I use this for my store's brand?
Yes. Start from one of your brand visuals, grab the HEX codes, then drop them into your Vivlab store theme. Afterwards, check text-on-background legibility with the contrast checker.
Keep exploring