What image format should I use?
When choosing a file format to use, there’s usually more than one format that will work, though some work better than others. The software you’re using will often determine what formats you can use depending on what it supports. All of the formats have transparent backgrounds to make them easier to place on top of images and colored backgrounds.
In most cases you’ll want to use a vector based file format. With a vector file, it’ll look crisp and sharp if you’re using an icon online or printing a document. If you can’t use a vector file format, then use a PNG and pick one of the larger sizes provided. That way you have more flexibility when scaling the PNG and there’s a better chance it’ll still be crisp and sharp.
Here’s a quick rundown of each file format included in the set:

SVGs

SVG are vector based. Which means they can scale up and down to any size and still look sharp and crisp. If you’re comfortable with editing a little HTML/CSS, they also have the advantage of being editable by changing the code in a few spots inside the SVG file. You can also usually open and edit them with text editors included with Windows and Mac OS. Our section on changing icon colors covers this in more detail.
Best for websites
Read this section for more info about using SVGs and PNGs in popular website builders and CMSes.

PNGs

PNGs are raster based. Which means they can scale up and down, but if scaled up past the file’s original dimensions an icon will likely start to look blurry on the screen or when printed out. A good rule of thumb is if you can’t use SVGs, then PNGs are the next best option. They have better support than SVGs as far as inserting them into documents in programs like Google Docs and Microsoft Word. They also have better support for viewing them in email clients like Gmail and Outlook. We include different sizes PNGs for each icon to make them more convenient to use.
  • Best for emails
  • Good for websites
  • Good for documents

PDF

PDFs are vector based. Which means they can scale up and down to any size and still look sharp and crisp. They are best for using in documents if your editing software supports inserting them. You can also use them with online print vendors like VistaPrint, in layout software like Adobe InDesign, or have your designer use them in a brochure or business card layout.
  • Best for documents
  • Best for printed materials like brochures and business cards

EPS and AI

EPS and AI files are vector based. AI is a specific file format used by Adobe Illustrator while EPS files are more for general use and supported by more software programs. These are the original source files used to craft the icons. The icons are not saved out individually like in the other formats and include all the icons in several large documents. This makes them easier to edit and combine as needed. When you or a designer you work with opens them in a vector graphics editor, all the strokes that make up the icons can be changed. You can also combine icons to make new ones or change colors of the icons and save them out individually in different formats to use elsewhere.
  • Best for editing and making custom icons
  • Best for saving the icons in different file formats

More Resources

Here are a few recommended articles you can check out for more in-depth info.
Last modified 2yr ago