Svgsus: Tips & Tricks

Here are a few short and handy explanations on some of the things Svgsus can do to improve your workflow, both when designing and developing.

Mac App Store | svgs.us

Turn an SVG file into code

  1. Make sure you have the proper output selection in the preferences.
  2. Drag the .svg file into Svgsus.
  3. Keep dragging the file to your editor. Release. Done.
    Release the file into Svgsus, and paste (cmd+v) into your editor. This will give you better indentation.
Drag your svg into Svgsus, and keep dragging it to your editor to paste the generated code.

Turn a shape selection into an SVG file

  1. Make the selection and copy the shape (cmd+c).
    Use Sketch, Illustrator or some other vector based tool
    .
  2. Paste (cmd+v) it into Svgsus.
  3. Paste again wherever you wan’t the svg to be located. What you got now is a clean and beautiful svg.
    Tip: Code for the svg is also available if you paste into an editor.
Easily export a shape to a cleaned svg file.

Add your own icon sets

  1. Drag a folder that contains svgs into Svgsus.
    Tip: If the svgs are located in subfolders, they will be grouped by each subfolders name inside Svgsus.

Convert multiple files at once

Available from v0.15.0

  1. Enablemulti convert’ in the top right corner.
  2. Select the assets you’d like to export.
    Tip: Use cmd+a / cmd+alt+a to select / deselect all.
  3. Select desired format.
    Swift code isn’t currently supported, but will be added soon.
  4. Convert!
  5. Open Finder in desired location and paste (cmd+v) the files.
    If you prefer to select location right away, simply click the download icon.
Convert multiple SVG’s at the same time

Add tags to your SVG’s to improve search results

Available from v0.15.0

  1. Select an svg of your choice.
  2. Enter desired tags in the expanded toolbar.
    Tip: If you’re sharing the folder with others (via e.g. Drive, Dropbox) the tags will be shared as well.
Add tags to improve search / filter results

Need an actual SVG file as output?

  1. Press an icon (or drop it or paste it) into Svgsus.
  2. Now paste (cmd+v) in finder, this gives you a cleaned svg file.

Try Svgsus out at the Mac App Store Or read more at svgs.us.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.