# Social Icons

![](https://1019271128-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LLV-zTvL3gIREI2fwqd%2F-LLV00pz68a2T7F_RSXi%2F-LLV0AQhKMb2lG5Uimxo%2Fsi-1.png?generation=1535987988826912\&alt=media)

Social icons are just a list with `.social-icons` class

```
<ul class="social-icons">
  <li><a href="#"><i class="fa fa-facebook"></i></a></li>
  <li><a href="#"><i class="fa fa-twitter"></i></a></li>
  <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
  <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
  <li><a href="#"><i class="fa fa-skype"></i></a></li>
  <li><a href="#"><i class="fa fa-dribbble"></i></a></li>
</ul>
```

## Size

Three sizes are available that you should add the corresponding class to the `.social-icons` class

* `.size-small` for small ones
* no class for medium ones
* `.size-large` for large ones

## Shape

* `.shape-circle` to make them circle
* `.shape-square` to make them square

## Color Skins

* `.skin-white`
* `.skin-red`
* `.skin-blue`
* `.skin-yellow`
* `.skin-green`
* `.skin-dark`

## Hover color skins

* `.hover-white`
* `.hover-red`
* `.hover-blue`
* `.hover-yellow`
* `.hover-green`
* `.hover-dark`
