There are more complicated methods but a quick, easy way is to just copy the svg element from the DOM (you may need to include your css files as well), paste it into a file and save it with the extension .svg. After that you can open it in a vector editor. There are also … Read more
One way is to add a feComponentTransfer filter primitive, like this: <filter id=”dropshadow”> <feGaussianBlur in=”SourceAlpha” stdDeviation=”3″/> <feOffset dx=”2″ dy=”2″/> <feComponentTransfer> <feFuncA type=”linear” slope=”0.2″/> </feComponentTransfer> <feMerge> <feMergeNode/> <feMergeNode in=”SourceGraphic”/> </feMerge> </filter> A live example can be seen here.
See svgweb quickstart and the svgweb project homepage for something that works in all browsers including IE (requires flash plugin). There are many ways to include an existing svg file: <img src=”https://stackoverflow.com/questions/2011289/your.svg”/> <object data=”https://stackoverflow.com/questions/2011289/your.svg”/> <iframe src=”https://stackoverflow.com/questions/2011289/your.svg”/> <embed src=”https://stackoverflow.com/questions/2011289/your.svg”/> <div style=”background:url(your.svg)”>…</div>
Gimp can be used to convert SVGs with primitives (e.g. rects, circles, etc.) into a single path which can be used within HTML5. First download Gimp: https://www.gimp.org/downloads/ Export your SVG as a .svg file with any tool of choice e.g. Illustrator. Don’t worry if the SVG output is messy for now, Gimp will clean it … Read more
SVG profiles SVG 1.0: all modern desktop and mobile browsers support SVG 1.1, so never choose this option. SVG 1.1: You will almost always want this. SVG Tiny/Basic: this is a subset of SVG intended for mobile devices. Only a handful of devices support SVG Tiny and not the full spec, so go for SVG … Read more