Inline SVG to PNG

Export inline and embedded SVGs as PNG or SVG with CSS/font capture, highlighting, frame support, and trim.

Export the SVG you actually see on the page — as PNG, as SVG, or both at once. Right-click any SVG on a page and choose from three actions: Generate PNG, Generate PNG & Save SVG, or Save SVG. The extension works on inline SVG elements as well as SVG files loaded through img, object, and embed elements. Most SVG export extensions break on real sites. This one was built specifically for the cases they miss: 🔲 Works inside frames — the content script runs in every frame, so SVGs embedded in iframes are detected and exported correctly. 🎨 Captures the visual output — computed CSS styles are inlined into the exported file, so the result matches what you see on the page, not just the raw SVG markup. 🔤 Embeds web fonts — @font-face rules used by SVG text are fetched and embedded directly into the exported file so text renders correctly when the file is opened elsewhere. ✂️ Optional PNG trim — transparent padding around the SVG can be automatically cropped from the generated PNG so you get a tight image with no empty borders. 🖼️ Export PNG + SVG together — save both formats in one click for design handoff or archiving. 🔍 Visual target highlighting — enable the Highlight SVG option to see a glowing outline on every exportable SVG on the page before you right-click. Choose from eight highlight colors. ⚡ Always-visible menu — the SVG Export context menu is always present and its actions enable automatically when you hover over or right-click an eligible target. Want to see it in action? Try the extension on any page with SVG graphics — or open https://codepen.io/iamjoshellis/pen/PPLYJN and right-click the illustration. SVG illustration used in screenshots: "London" by Josh Ellis (@iamjoshellis) on CodePen — https://codepen.io/iamjoshellis/pen/PPLYJN