#theme icons

site models icons

✧ ｡ °. ｡   red velvet - psycho: vintage icons   ｡.° ｡ ✧

like / reblog if you save

do not repost pls 

❝ over 900 material system icons, available in a variety of sizes and densities, and as a web font. ❞

material icons are available as an svg, png or standard font ( similar to ‘fontawesome’ or ‘linearicons’ )

how to use

place the font reference in your code above the ‘head’ section ( usually above </head><style> ) - it’s exactly the same as including any other google font in your theme!

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

then select the icon you wish to use from the material icons library - click on it and a blue bar will appear at the bottom of the page.  

you can select a default black or white icon to download as a svg or png.  you can also choose the resolution if downloading as an image.

to use this as a font - just click on the ‘< > icon font’ link ( at the right hand side ) for the code...

the icons work on an ‘i class’ like fontawesome - to install in your theme, just copy and paste the code where you would like the icon to appear - e.g. <i class="material-icons">pets</i>

you can style this font with css just like any other google font using a ‘.material-icons’ class as this class is already included in the icon link.  for example -

.material-icons {    font-size: 14px;    color: #ffffff;}  

for other icon packs to use in your themes you can check out:

saturnthms custom icons - a beautiful custom icon pack 

linearicons - a simple linear design for minimalist themes

fontawesome - standard icons with a wide range to choose from

primary colors