Custom Shape Libraries (and where to find awesome SVG files to fill them)

By May Woo on Oct 22, 2013 in Tips and Tricks

A few weeks ago we announced at Atlassian’s Summit that you can now make Custom Shape Libraries in Gliffy which means you’re no longer limited to our default shapes.  Do you want a library of custom arrows? Logos? Network symbols? Just in case you missed our demo, I’m going to show you where to find new shapes and how to add them to Gliffy.

custom-library

If you already have SVG files for the shapes you want, you can skip to the steps on how to add a custom library below

What Kind of Files to Use and Where to Find Them

First of all, while you can use SVG, JPG, GIF, and PNG files in your custom shape libraries, we really recommend SVGs. Why?  SVGs are vector files so they’re scalable.  This means you’ll be able to make your shapes as big (or as small) as you want and they’ll stay sharp and crisp, unlike raster files like JPGs, GIFs and PNGs (which become blurry when you make them bigger).

Some good places to find SVG files for common symbols are:

IcoMoon is currently my favorite resource for SVGs.  Not only does it have a great selection of icon sets to search from, but you can also specify the hex color and size for the icons you want before downloading them.  If for any reason you want to edit your shapes further, you can do this in a vector graphics application like Illustrator, Sketch, or any number of free options like Inkscape  or Janvas 2d.

How to Add A Custom Library

Once you’ve got the SVG files you want, you’re ready to add them to Gliffy by doing the following:

  1. Click the “More Shapes” button at the bottom of the left sidebar.click-more-shapes
  2. Click the “Add Custom Shape Library” button in the dialog that pops up.click-add-custom-library
  3. Give your Shape Library a name and then drag and drop your  SVG files from somewhere on your computer into the specified area in the dialog box (or click the upload link)name-and-add-shapes
  4. Click the “Save Library” button at the bottom of the dialog! That’s it!

 If you have any questions or requests, feel free to send an email to support@gliffy.com or leave a comment here!

Sharing is caringShare on FacebookShare on Google+Tweet about this on TwitterShare on RedditPin on PinterestShare on LinkedIn