Very easy to use, but without disadvantages of icon fonts.

SVG Framework - replacement for icon fonts.

Iconify offers multiple ways to use icons: How to use this icon set with Iconify?īrowse this icon set on Iconify website, click any icon (for example, content-paste) and scroll down to see code. You are no longer limited to this icon set, but can choose various icons from other icon sets that follow Material Design guidelines:Īnd many other icon sets. That means if you display 20 icons on page, visitor will load data only for those 20 icons, no extra stuff. Unlike fonts and SVG frameworks, Iconify only loads icons that are used on the current page. Iconify project uses a new innovative approach to loading icons. Iconify project makes it easy to add SVG icons to websites and offers over 100,000 icons to choose from. So what is the alternative? Use SVG! IconifyĪll icons are available with Iconify. It causes website to load slower, which also affects SEO. Why load 5000 icons to display 5? It is a waste of bandwidth for visitors.

Icon fonts contain lots of icons you do not use.

If you want to display an image, use image. This results in blurry edges, bad alignment, it is especially bad when using Windows. When browser renders icon font glyph, it uses different algorythm than when rendering images. They were a good idea many years ago when browsers had poor support for SVG, but in modern world avoid icon fonts like a plague. Icon fonts are easy to use, but they are bad, very bad. Web font is is available in material-icons-font repository. To get SVG files, you can either clone GitHub repository or install NPM package. SVG files are scalable, duplicating them for different sizes is pointless. If you need a different size, change width and height attributes in the icon. Each directory contains up to 5 SVG files, one for each icon variation.Īll icons are 24x24, cleaned up and optimized. SVG files are available in the directory 'svg', followed by icon name. This repository does not use the same build process as the official Google MDI repository and has a different folder structure. This readme explains how to use updated icons set in your projects. If you need another format, please open an issue on this repository and specify what format, size and colour you need. Other available formats are in different repositories: This repository includes only icons in SVG format. This repository includes several variations for each icon:

Version 3 that is available in the official icons repository only includes 1 variation of each icon. You can find an older version of this icon set in google/material-design-icons repository.īecause the official repository is no longer maintained, I have decided to make an alternative repository with the latest icons. This is an updated version of icons, which includes all icons available at material.io. The icons are designed under the material design guidelines. Material Design Icons is the official icon set from Google.

Google photos icon png