Free brand color extractor
Drop in a logo or an ad and get its colors as hex, RGB and HSL codes, ranked by how much of the image each one covers, with a readability check for text on every swatch. It runs in your browser, so your image never leaves your device.
Primary, secondary and accent: reading the result
The percentages tell you the role each color plays. The color with the biggest share is usually the primary brand color. The next one or two are secondary colors, often a dark used for type and a light used for space. A color with a small share and strong saturation is an accent: the one a brand saves for buttons, prices and badges.
A logo gives you the brand as designed. An ad gives you the brand as it is actually used, including the background and photo colors. Run both if you are building ads for a brand you do not own the guide for: the logo tells you what to keep, the ad tells you what they put around it.
Using brand colors in an ad
Give the product the contrast. Put the product on a background that is not one of its own colors, so it separates from the frame at thumbnail size.
Keep the accent for the action. If the call to action, the price and the badge are the only places the accent appears, the eye lands on them first.
Check the text. Use the contrast line on each swatch before you set a headline on a brand color. Ads are read small, fast and often in bright light; a pairing that passes AA at least is the safe floor.
Two or three colors are enough. One primary, one dark or light for type, one accent. More than that and the ad stops looking like a brand.
Want the colors applied for you?
AdDogs extracts your brand colors automatically and applies them when it rebuilds an ad: pick one of 14,000+ ad examples or upload any ad, add your product photo, and get the same layout in your brand. Logo placement is included on Pro and Ultimate. New accounts get 3 free credits.
How to find a brand's colors from its logo
- Step 1
Add a logo or an ad
Drop a PNG, JPG or WebP into the tool. A logo file with a transparent background gives the cleanest palette. It stays in your browser.
- Step 2
Ignore the background
If the image sits on a flat background, the tool detects it and leaves it out, so the shares describe the artwork. Switch it back on if the background is part of the brand.
- Step 3
Choose how many colors
Three gives you the core of the brand, six is a working palette, ten shows the supporting tones and shadows too.
- Step 4
Copy the codes
Copy any hex code, or the whole palette as CSS custom properties or JSON for your design tool, site or ad template.
Got the colors and need the ad in every size? The free ad resizer crops or pads one ad to all 14 platform sizes.
FAQ
Yes. No sign-up, no watermark and no limit. It runs entirely in your browser, so your image is never uploaded to our servers.
It reads every pixel of a downscaled copy of your image, groups near-identical pixels, merges shades that are too close to tell apart (anti-aliased edges, JPEG noise), and ranks what is left by how much of the image each color covers. Transparent pixels are skipped.
Each swatch is the average of a group of very similar pixels, and JPEG compression and resizing shift colors by a few points. If you have an official brand guide, its codes win. Use this tool when you do not have one, or to check what an ad actually shows.
Each swatch shows whether white or black text reads better on it, with the WCAG contrast ratio. 4.5:1 is the AA level for normal text, 3:1 for large text, and 7:1 is AAA. Low-contrast text is hard to read on a phone in a busy feed.
Take a screenshot of the site and drop it in. The tool only reads images, so it never visits a URL on your behalf.