Social Buttons made in CSS based on Bootstrap

Social buttons made in pure CSS based on Bootstrap and Font Awesome by Lipis. These buttons are easy to use.

social-buttons-bootstrap

Usage

1. Include Bootstrap and Font Awesome.

<head>
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
    
    <!-- FontAwesome -->
    <link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
</head>

2. Add some buttons

After adding the CSS, you can start using the buttons as you’ve normally do with the Bootstrap buttons that have an icon by adding the relevant class. For example:

<a class="btn btn-block btn-social btn-twitter">
    <i class="fa fa-twitter"></i> Sign in with Twitter
  </a>

Or if you want to just the icon button use it like this:

<a class="btn btn-social-icon btn-twitter">
    <i class="fa fa-twitter"></i>
  </a>