Extra Styles/Colors For Bootstrap 4 Buttons – button.css

Author: mohammad-hammal
Views Total: 2,876 views
Official Page: Go to website
Last Update: April 3, 2018
License: MIT


Extra Styles/Colors For Bootstrap 4 Buttons – button.css


button.css is a CSS extension for the latest Bootstrap framework that adds more styles, animations, and colors to the regular Bootstrap buttons.

How to use it:

Just download and insert the stylesheet button.min.css after Bootstrap 4 stylesheet and we’re ready to go.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<link href="button.css" rel="stylesheet" type="text/css">

Add the following CSS classes to your Bootstrap buttons.

  • btn-3d: 3D button
  • btn-icon-overlay: with icon overlay
  • btn-circle: rounded borders
  • btn-fill: color fill
  • fill-top: animation direction
  • fill-right: animation direction
  • fill-bottom: animation direction
  • fill-left: animation direction

Change the colors of your Bootstrap buttons.

  • btn-green
  • btn-blue
  • btn-purple
  • btn-orange
  • btn-dirty-green
  • btn-aqua
  • btn-grey

The CSS library also comes with several social colors:

  • btn-facebook
  • btn-twitter:
  • btn-pinterest
  • btn-youtube
  • btn-linkedin
  • btn-google-plus

See also  Scifi-style Animated Tabs Interface with Pure CSS/CSS3

Leave a Reply

Your email address will not be published. Required fields are marked *