How to extract svg as file from web page

html svg
Vladyslav K picture Vladyslav K · May 5, 2017 · Viewed 219.9k times · Source

enter image description here

enter image description here

I want to save SVG as file from this page https://www.lightningdesignsystem.com/icons/ Is there any Chrome extension or other way to do this?

Answer

Em-AK picture Em-AK · Nov 28, 2019

When the SVG is integrated as <svg ...></svg> markup directly into the HTML page.

  1. Right click on the SVG to inspect it in developer tools
  2. Find the root of the <svg> element and right click to "Copy element"
  3. Go to https://jakearchibald.github.io/svgomg/ and "Paste markup"
  4. Download your optimized SVG file and enjoy

Related questions

Do I use <img>, <object>, or <embed> for SVG files?

Should I use <img>, <object>, or <embed> for loading SVG files into a page in a way similar to loading a jpg, gif or png? What is the code for each to ensure it …

Read More
SVG drop shadow using css3

Is it possible to set drop shadow for an svg element using css3 , something like box-shadow: -5px -5px 5px #888; -webkit-box-shadow: -5px -5px 5px #888; I saw some remarks on creating shadow using filter effects. Is there an …

Read More
Modify SVG fill color when being served as Background-Image

Placing the SVG output directly inline with the page code I am able to simply modify fill colors with CSS like so: polygon.mystar { fill: blue; }​ circle.mycircle { fill: green; } This works great, however I'm looking for a way to …

Read More