How to Use Web Font Icons

How to Fontice Icons Font

How to use fontice icon in your design

How to use fontice icons in HTML code

(1) Include CSS File

The first step is to include fontice-iconsfont.css in your the head of your HTML. Make sure you change the path to point to the file on your server.

<link rel='stylesheet' href='yourpath/fontice-iconsfont.css' />

(2) Change path in css

open “fontice-iconsfont.css” Again, ensure that the path to the files matches the setup on your server.

@font-face {
font-family: ‘Fontice-IconsFont’;
src: url(‘../yourpath/Fontice-IconsFont.eot?v=1.0’);
src: url(‘../yourpath/Fontice-IconsFont.eot?v=1.0#iefix’) format(’embedded-opentype’),
url(‘../yourpath/Fontice-IconsFont.ttf?v=1.0’) format(‘truetype’),
url(‘../yourpath/Fontice-IconsFont.woff?v=1.0’) format(‘woff’),
url(‘../yourpath/Fontice-IconsFont.svg?v=1.0#Fontice-IconsFont’) format(‘svg’);
font-weight: normal;
font-style: normal;}

(3) HTML Integration

Check HTML Integration code below

<i class="fi fi-newspaper"></i>

Done! Result

You can customize by apply css properties

You can customize by apply css properties