# Icons

There are three different types of icons used in this theme

**1) Font Awesome Icons :**

![](https://2744120822-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M4TuOJbH6fevdwDEJ2u%2F-M4TuRpnVefLKP77JKOd%2F-M4TuYKDT7U_3vYzjIkC%2Fadmire40.png?generation=1586435349026560\&alt=media)

It has the following Structure:

```
<a href="#">
  <i class="fa fa-phone"></i>
</a>
```

**Icons Size** - determines the size of icons, can take such values: fa-lg, fa-2x, fa-3x, fa-4x and fa-5x

```
<a href="#">
  <i class="fa fa-phone fa-lg"></i>
</a>
```

**Stacked icons** - It stacks the multiple icons. we can also control the size of the icons using the parameters : fa-stack-1x fa-stack-2x.

```
<span class="fa-stack fa-lg">
 <i class="fa fa-circle fa-stack-2x text-info"></i>
   <i class="fa fa-home fa-stack-2x fa-inverse"></i>
</span>
```

**2) Themify Icons**

![](https://2744120822-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M4TuOJbH6fevdwDEJ2u%2F-M4TuRpnVefLKP77JKOd%2F-M4TuYKFoQ6liwCxONgK%2Fadmire41.png?generation=1586435348811829\&alt=media)

It has the following Structure:

```
<a href="#">
  <i class="ti arrow-up"></i>
</a>
```

We can import our desired icon just by replacing `arrow-up`in the above code with the icon we want.

**3) IonIcons**

![](https://2744120822-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M4TuOJbH6fevdwDEJ2u%2F-M4TuRpnVefLKP77JKOd%2F-M4TuYKHPvFEtzYhy4sP%2Fadmire42.png?generation=1586435349250257\&alt=media)

It has the following Structure:

```
<a href="#">
  <i class="ion-ionic"></i>
</a>
```

We can import our desired icon just by replacing `ion ionic`in the above code with the icon we want.