Pick colors from SVG & Illustrator files

Drop an SVG or Illustrator (.ai) file to see every color it defines (fills, strokes and gradient stops) and pick any blended or anti-aliased color with the eyedropper.

Drop an SVG or Illustrator file here

orYou can also paste with ⌘+V

SVG files and Illustrator (.ai) files saved with PDF compatibility

Opens on your device, never uploaded

Picked colors

Colors you pick show up here. Pick as many as you like. They stay here until you import or clear them.

Opens the editor and adds these colors as one group, with names, shades, contrast checks and code export.

How it works

1Drop your SVG or .ai file
Drag a logo, icon or illustration onto the page. SVGs are rendered in high resolution; Illustrator files open when they were saved with PDF compatibility (the default).
2Get the file's exact colors
Every fill, stroke and gradient color in the file is listed. Click one, or “Add all”. Use “Pick a color” for any color in between.
3Collect your colors
Every pick lands in the grid below with its HEX code and name. Pick as many as you like, copy them or remove the ones you don't need.
4Open them in the editor
Press “Import into PickXColor editor” to add all colors as one group, with names, shades, contrast checks and code export.

Frequently asked questions

Is it privacy-safe and GDPR-compliant?

Yes. Your file is opened and processed entirely in your browser. It is never uploaded, stored or sent to a server, and we never see it. There's no account, no tracking and no cookies, and the tool pages don't load anything from third parties. Because none of your file data reaches us, there is no personal data from it that we could process.

The colors you pick are kept in your browser's local storage, so they survive a reload. Clear them with the Clear button or by deleting this site's data.

Is it safe to use?

Yes. Nothing is installed and your file is only read, never changed. SVGs are shown as plain images, so scripts inside them never run and they can't load anything from the internet. Illustrator files are rendered by pdf.js with scripting turned off. You can check it yourself: open your browser's developer tools on the Network tab while you work: your file never shows up in a request.

Why won't my Illustrator file open?

Browsers can read .ai files only when they contain a PDF version, which Illustrator adds when “Create PDF Compatible File” is ticked in the save options (on by default). Without it, save the file again with that option, or export it as SVG or PDF.

Does it find colors inside gradients?

Yes. Gradient stop colors are listed with the other colors. Colors between the stops are blends: pick them with the eyedropper anywhere on the gradient.

Why are some colors missing from the list?

The list shows plain color values written in the file (HEX, rgb(), hsl() and named colors). Colors set through CSS variables, filters, embedded bitmaps or “currentColor” only exist once the file is drawn, so pick those with the eyedropper.

How accurate are the colors?

The eyedropper reads the exact value of the pixel you pick, as your browser decoded it, in sRGB. Zoom in until the pixel grid appears and you can see every single pixel, including noise, compression artifacts and anti-aliased edges, before you pick.

What can I do with the picked colors?

Copy all HEX codes at once, or press “Import into PickXColor editor”. The editor adds them as one named group on an infinite board, with human color names, HEX, RGB, HSL, OKLCH and CMYK values, Tailwind-style shades, WCAG contrast checks and code export for CSS, Tailwind, SCSS, Swift and Jetpack Compose.

Is it free?

Yes. It's free with no sign-up, no watermark and no limit on how many colors you pick.

More ways to pick colors

Every tool runs in your browser and adds to the same picked colors.