Social Icons

Your trigger to Social Networks
  1. Home
  2. Shortcodes
  3. Social Icons

<a href="#" class="social-icon si-facebook">

	<i class="icon-facebook"></i>

	<i class="icon-facebook"></i>

</a>

<a href="#" class="social-icon si-dark si-facebook">

	<i class="icon-facebook"></i>

	<i class="icon-facebook"></i>

</a>
Note: Just add the class .si-dark to the .social-icon to make it dark 

<a href="#" class="social-icon si-light si-facebook">

	<i class="icon-facebook"></i>

	<i class="icon-facebook"></i>

</a>
Note: Just add the class .si-light to the .social-icon to make it light 

<a href="#" class="social-icon si-rounded si-facebook">

	<i class="icon-facebook"></i>

	<i class="icon-facebook"></i>

</a>
Note: Just add the class .si-rounded to the .social-icon to make it rounded 

<a href="#" class="social-icon si-dark si-rounded si-facebook">

	<i class="icon-facebook"></i>

	<i class="icon-facebook"></i>

</a>
Note: Just add the class .si-dark & .si-rounded to the .social-icon to make it dark & rounded 

<a href="#" class="social-icon si-light si-rounded si-facebook">

	<i class="icon-facebook"></i>

	<i class="icon-facebook"></i>

</a>
Note: Just add the class .si-light & .si-rounded to the .social-icon to make it light & rounded 

<a href="#" class="social-icon si-borderless si-facebook">

	<i class="icon-facebook"></i>

	<i class="icon-facebook"></i>

</a>
Note: Just add the class .si-borderless to the .social-icon to make it borderless 

<a href="#" class="social-icon si-borderless si-text-color si-facebook">

	<i class="icon-facebook"></i>

	<i class="icon-facebook"></i>

</a>
Note: Just add the class .si-text-color to the .social-icon to make the Icon Colored 

<a href="#" class="social-icon si-colored si-facebook">

	<i class="icon-facebook"></i>

	<i class="icon-facebook"></i>

</a>
Note: Just add the class .si-colored to the .social-icon to make it colored

Small Icons


<a href="#" class="social-icon si-dark si-small si-facebook">

	<i class="icon-facebook"></i>

	<i class="icon-facebook"></i>

</a>
Note: Just add the class .si-dark & .si-small to the .social-icon to make it dark & small

Large Icons


<a href="#" class="social-icon si-dark si-large si-facebook">

	<i class="icon-facebook"></i>

	<i class="icon-facebook"></i>

</a>
Note: Just add the class .si-dark & .si-large to the .social-icon to make it dark & large

Share Panel

Share this Post:
Note: You can mix various classes together to make the social icons look according to your needs. It is completely flexible and extendable.