Buttons
Vertical variation
Use .btn-group-vertical in the parent element of the buttons to create vertical button group
Use .btn-{color} along with .btn to create a button
Use .round for round buttons
Use .btn-outline-{color} to create an outline button
Use .round with outline button to create round outline button
Use .bg-light-{color} to create light buttons
Use .round with light button to create round light button
Use .btn-icon for icon buttons and .btn-icon.round for round icon buttons
Group a series of buttons together on a single line with the button group. Wrap a series of buttons with .btn in .btn-group
Add .btn-lg or .btn-sm for Fancy larger or smaller buttons size
Add .btn-lg or .btn-sm with .btn-outline for Fancy larger or smaller outline buttons sizes
Add .btn-group-lg for larger button group size
Add .btn-group-sm for smaller button group size
Create block level buttons—those that span the full width of a parent — by adding .btn-block
Use .btn-group-vertical in the parent element of the buttons to create vertical button group
.gradient-purple-bliss
.gradient-mint
.gradient-pomegranate
.gradient-ibiza-sunset
.gradient-king-yna
.shadow-z-1-hover
.shadow-z-4
.big-shadow
.sidebar-shadow
.card-shadow
Social Media Buttons
Default Buttons
Use
.btn-socialand.btn-{social-media}like.btn-facebookfor social buttons with icons. Add.roundfor round button.Outline Buttons
Use
.btn-socialand.btn-outline-{social-media}like.btn-outline-linkedinfor social buttons with icons. Add.roundfor round button.Default Icon Buttons
Use
.btn-social-iconand.btn-{social-media}like.btn-facebookfor social icon buttons. Add.roundfor round button.Outline Icon Buttons
Use
.btn-social-iconand.btn-outline-{social-media}like.btn-outline-linkedinfor social icon buttons. Add.roundfor round button.