icon-file-formats

Icon File Formats: What you need to know.

What icon file formats are there? Which one is the most suitable? You will find out in this article.

There are countless formats for saving images. You probably know JPG from your digital camera and PDF for saving documents. Icons should not be saved in any of these formats. But before I show you which icon file format you should use, it’s worth dividing the huge number of file formats into two categories.

Pixels vs. Vectors Icon file formats

Even if you are not a computer professional, you should know the following basics about image formats. Basically there are two ways to save images:

Pixels

icon-file-formats-pixels
Coffee Cup Icon in Raster Image File Format

The computer stores individual pixels on a raster. The more dots the raster has, the better the resolution and thus the image quality. You probably know this from your digital camera. The number of megapixels indicates how fine the raster is.

When should you use bitmaps:

  • Photography
  • Documents scans
  • Renderings

Raster Image file formats list (common files)

  • JPG, JPEG
  • PNG
  • GIF
  • WEBP
  • TIFF
  • PSD
  • BMP
  • RAW
  • HEIF

Vectors

icon-file-formats-vectors
Coffee Cup Icon in Vector File Format

Paths are stored in the form of vertices and vectors, as the name vector graphics implies. When the image is scaled, the distances between the vertices change. The intervening path is recalculated by the computer. As a result, you can scale the graphic file, which is in vectors, infinitely. You can also adjust the vertices with appropriate software and thus edit your graphics.

For what kind of images are vector files suitable:

  • Icons
  • Logos
  • Illustrations
  • Geometric shapes
  • Letters

Vector file formats list (common files):

  • SVG
  • EPS
  • PDF
  • AI
  • DXF

Interim summary

As you might have guessed, bitmaps are not the best choice for storing icons. So you should always use a vector format if possible. But which one is the best? The following table compares the most common icon file formats.

Icon file formats comparison


SVGEPSPNG JPGICO
Filesizelowestmiddlehighestmiddlelowest
Typevectorvectorpixelpixelpixel
Loseless scalingyesyesnonono
transparent backgroundyesyesyesnono
easy coloringyesyesnonono
shape editingyesyesnonono
recommendationbest file format for iconsokay, but use svg if possibleonly for compatibilitynot recommendednot recommended

Wait a minute.

There are also pixel graphics in the table. Why are they included in the table when the best format to save an icon is a vector file?

Unfortunately, not all programs can process vector files. For this reason, icons are often also supplied as PNG files. Compared to JPG, PNG files allow transparent backgrounds, which makes the integration of icons into existing designs much easier. Sometimes it is also a business model of the provider of icons to provide them in a pixel format (of low resolution) for free download. The vector files are then usually only available against payment.

Summary

The best file format for saving icons is clearly the SVG format. It offers maximum flexibility in scaling, paths can be edited and integration with existing graphics is straightforward, as no backgrounds need to be cropped. In case of compatibility problems, PNG is the first choice. With this icon file format, the resolution should not be less than 512 pixels. It is also important that the background of these files is transparent. My icon library provides all icons in SVG format with the option to also download PNG to be compatible for all programs.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.