: How do I save an SVG that's on a website to my computer? I need to work with a logo from this website (in the top left corner): Here is the piece of code I copied from the page: <svg

@Shanna688

If you're using Safari on macOS, there's built-in functionality for this. Simply right click the SVG image, hit "Save Page as..." followed by choosing "Format: Page Source" in the resulting drop-down menu.

Vote Up Vote Down

@Carla748

Sure. Make it complicated if you like - but it's not. Open the .svg file in a new browser window. Choose print -> save as pdf -> open in illustrator or other vector apps. :)

Vote Up Vote Down

@Merenda852

You can run this code on your javascript console:

var e = document.createElement('script');
e.setAttribute('src', 'https://nytimes.github.io/svg-crowbar/svg-crowbar.js');
e.setAttribute('class', 'svg-crowbar');
document.body.appendChild(e);


or use this bookmarklet. Worked perfectly for me:

Vote Up Vote Down

@Gretchen549

The snippet you posted is not valid XML. It needs an XML declaration and the <path> tag needs to be closed.

<?xml version="1.0" encoding="UTF-8"?>
<svg viewBox="0 0 215 50" height="50" width="215" xmlns="http://www.w3.org/2000/svg">
<path
d="M128.783 40.08v7.74h2.078v-5.66h18.843v5.66h2.08v-7.74h-3.322V5.82h-14.017c0 14.588-.467 23.26-2.596 34.263h-3.064zm-43.58 2.08h4.154V5.82h-4.153v3.116l-9.138 24.352V5.818h-4.153V42.16h4.153v-3.114l9.138-24.35v27.465zm-22.842 0h4.36l-6.904-21.08 4.83-15.262h-2.13l-4.88 15.263H52.08V5.82h-4.155V42.16h4.156v-19h4.048l6.233 19zm71.562-2.08c1.764-10.433 2.492-18.842 2.598-32.186h7.783V40.08h-10.38zm74.6 2.08h4.31L204.894 5.82h-4.31l.88 4.206-6.852 32.137h2.13l2.59-12.097h6.548l2.643 12.098zm-169.574 0h4.31L35....8zm147.355 0h4.158V5.82h-13.968v2.076c-.05 8.05-.414 18.12-1.143 23.204-.466 3.066-1.61 5.508-3.532 5.508v5.555c3.588 0 4.623-4.83 5.246-9.24.936-6.752 1.4-16.976 1.506-25.025h7.732V42.16zM159.88 7.896h9.347V5.818H155.73V42.16h13.497v-2.08h-9.348V20.564h7.265v-2.076h-7.266V7.895zm-59.1 0h9.34V5.818H96.626V42.16h13.496v-2.08h-9.34V20.564h7.266v-2.076h-7.265V7.895zm-96.2 0h8.306v34.267h4.152V7.895h8.306V5.818H4.58v2.077zm28.396 6.023l2.858 14.067h-5.66l2.802-14.067zm169.58 0l2.853 14.067h-5.66l2.807-14.067z"
/>
</svg>


Even after fixing those things, if I open that in Inkscape, however, it still doesn't quite look like the logo on the website. You're probably better off trying something like this to extract the SVG instead.

Vote Up Vote Down