Grab any SVG on the web.

How you use it

1. Right-click any logo, icon or illustration on a page.
2. Choose Copy SVG or Download SVG. Hold Shift for the browser’s own menu.
3. Click in the toolbar, or press Alt Shift S, to see every SVG on the page, logos first.
4. Click a tile to copy it. Hover it to save SVG or PNG, and to spot it on the page.
5. Download all saves everything as one .zip.

What you copy

Most SVGs lean on the page around them: a class for their color, a sprite defined somewhere else, a gradient in another file. Copy one raw and it pastes black, or blank. SVG Grab Pro brings all of that along.

<a class="share" href="/share" aria-label="Share">
  <svg class="icon"><use href="/sprite.svg#bolt" /></svg>
</a>

.share { color: #2563eb }
.icon { width: 16px; height: 16px; fill: currentColor }

<svg xmlns="http://www.w3.org/2000/svg"
  width="16" height="16" viewBox="0 0 24 24">
  <defs>
    <symbol id="bolt" viewBox="0 0 24 24">
      <path d="M13.2 1.6c.5-.3…" />
    </symbol>
  </defs>
  <use href="#bolt" fill="#2563eb" />
</svg>

• Styles baked in. Fills, strokes and sizes from the page’s CSS are written onto the SVG, only where they differ from what it inherits.
• currentColor resolved. Icons keep the color they had on the page.
• Sprites and gradients pulled in. <use> and url(#…) references come along in <defs>, even from external sprite files.
• Noise stripped. class, data-*, aria-* and event handlers are removed.

What it finds

Inline SVG

Any <svg> on the page, including inside open shadow roots.

SVG files

Images that point at .svg files, including ones hosted on another domain.

CSS icons

SVGs painted with background-image, mask-image or a ::before.

Under overlays

Icons sitting below transparent layers that swallow a normal right-click.

Logos

Spotted from labels, header placement and home links, then listed first and named like github-logo.svg.

Open source

The whole extension is on GitHub. Read how the detection works, file an issue, or build your own copy and play with it:

git clone https://github.com/ash-uxi/svg-grab-pro.git
cd svg-grab-pro
npm install && npm run build

Then open chrome://extensions, turn on Developer mode, choose Load unpacked and pick the folder.

Privacy

Everything runs on your device. No tracking, no analytics, no servers. By default it only runs on a tab after you open its popup there. Turn on All sites in the popup to right-click on any page without opening it first.