Social Buttons for Bootstrap 4

Social Sign-In Buttons made in pure CSS based on Bootstrap 4 and Font Awesome 5!

View on GitHub Download

Available Classes


How to use

  1. Include Bootstrap 4 and Font Awesome 5

    If you haven't done that already, include the latest Bootstrap 4 and Font Awesome 5 in your project.

  2. Include the CSS or Less

    You have two options for enabling the social buttons in your project: vanilla CSS or source Less. For vanilla CSS, just include the bootstrap-social.css file into your project.

  3. Add some buttons!

    Start using the buttons as you would 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 just want the icon button, use it like this:

    
        <a class="btn btn-social-icon btn-twitter">
          <i class="fa fa-twitter"></i>
        </a>
Fork me on GitHub