If multiple icons are in use on a web site, creating spritesheets out of the images is recommended. Icons are also available in the git repository under: material-design-icons/png/ They are referred to as 1x and 2x respectively in the download. Our downloads from the material icons library provide both single and double densities for each icon. PNG is the most traditional way to display icons on the web. For more information, refer to the documentation in the sprites directory of the git repository. The SVGs are also available from the material design icons git repository under the path: material-design-icons/src/įor example, icons for maps are in src/maps: material-design-icons/src/maps/ Individual icons are downloadable from the material icons library. The material icons are provided as SVGs that are suitable for web projects. Material icons are also available as regular images, both in PNG and SVG formats. Material icons look best at 24px, but if an icon needs to be displayed in an alternative size, using the above CSS rules can help: Host the icon font in a location, for example, and add the following CSS rule: Self hostingįor those looking to self host the web font, some additional setup is necessary. material-icons.Īny element that uses this class will have the correct CSS to render these icons from the web font. 'Material Icons' font specific to the browser.Īn additional CSS class will be declared called. Similar to other Google Web Fonts, the correct CSS will be served to activate the All you need to do is include a single line of HTML: The easiest way to set up icon fonts for use in any web page is through Google Fonts. The icon font weighs in at only 42KB in its smallest woff2 format and 56KB in standard woff format.īy comparison, the SVG files compressed with gzip will generally be around 62KB in size, but thisĬan be reduced considerably by compiling only the icons you need into a single SVG file with symbol
0 Comments
Leave a Reply. |
Details
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |