Drop a logo or a screenshot of any website and get its real colors back: a swatch sheet, CSS custom properties with 50 to 950 tint ramps, a Tailwind snippet, an Adobe .ase swatch file and a GIMP .gpl palette. Free, and your image never leaves this browser tab.
PNG, JPG, WebP, GIF or SVG. A full page screenshot of a live site works well, that is the fastest way to read a client's real colors instead of guessing them.
Click the image to add the exact color under your cursor.
Low separation returns near neighbours, several shades of the same blue. High separation forces the colors further apart.
Moving the sliders or the checkbox re-reads the image and replaces any swatches you edited. Switching Naming renames every swatch. Changing the Order keeps names you typed yourself.
The ZIP holds palette-sheet.png, brand.css, tailwind-colors.js, tailwind-v4-theme.css, brand.ase, brand.gpl, colors.json and a printable brand-guide.pdf.
The fastest honest way to get a client's brand colors is to read them off the thing they already have. Screenshot their homepage, drop it here, and the palette comes back with exact hex values. That beats eyedropping one pixel at a time, and it beats guessing from memory, which is how the wrong shade of blue ends up on a landing page and nobody notices until the client does.
Colors are found by counting the image's actual pixels, grouping the near identical ones, and then keeping only the results that are far enough apart to be genuinely different colors. That last step is the important one. Averaging methods drown a small logo in the big white field it sits on, and every real color collapses into one muddy blend. Counting and separating keeps flat logo and interface artwork honest.
Every color comes with a full 50 to 950 tint ramp, built by holding the color's hue and chroma in OKLCH and walking the lightness, then pulling the chroma back in at each step until the result fits inside sRGB. Without that last step the very light and very dark ends of a ramp drift off hue and look like they came from a different brand.
brand.css writes the hex value as the real value and puts the oklch() form in a trailing comment. That order matters: page builders and email clients still choke on modern color syntax, so the thing you paste into GoHighLevel or a Mailchimp template needs to be a plain hex.
The .ase here is written byte by byte as a real Adobe Swatch Exchange file: the ASEF signature, a version pair, a block count, then one block per color with a length prefixed UTF-16 name, the RGB color model tag, and three big endian floats. Photoshop rejects a file that gets any of that wrong, silently, which is why most quick palette sites do not offer one. Import it through Window, Swatches, then Import Swatches. Illustrator reads the same file through Open Swatch Library, Other Library.
The .gpl is the GIMP and Inkscape palette format, plain text, and it drops straight into your palettes folder.
Each color shows its WCAG 2.1 contrast ratio against white text and black text, marked AA or AAA, so you find out that your accent color is unreadable before it is in a headline rather than after a client complains. The ramps use the same maths to choose their own label color.
This replaces the palette export half of a Canva Pro or Coolors Pro subscription. It does not store fonts, logo files or templates the way a full Canva brand kit does, and it does not design anything for you. Contrast numbers are the raw WCAG 2.1 formula on the exact color pairs shown, which is not the same as an accessibility audit of a finished page. The .ase and .gpl files carry color values only, no color profiles, so treat the hex as the source of truth if a print shop asks. And an extractor reports what is in the picture: a screenshot full of stock photography returns photo colors, so crop to the header and the buttons if you want the interface palette.
Your image is read inside this browser tab with a canvas. It is never uploaded, and no color you extract is sent anywhere. The page itself counts an anonymous visit, the way any website does, and that ping carries nothing about your image or your palette.