Please wait...

  • KG
    Hello, John
    What is the update on Project X?
  • Hi, Alizee
    It is almost completed. I will send you an email later today.
  • KG
    That's great. Will catch you in evening.
  • Sure we'will have a blast today.

Buttons UI

Button class="" Description
btn btn-default Standard gray button with gradient
btn btn-primary Provides extra visual weight and identifies the primary action in a set of buttons
btn btn-info Used as an alternative to the default styles
btn btn-success Indicates a successful or positive action
btn btn-warning Indicates caution should be taken with this action
btn btn-danger Indicates a dangerous or potentially negative action
btn btn-link Deemphasize a button by making it look like a link while maintaining button behavior
Button class="" Description
btn btn-default btn-round Standard gray button with gradient
btn btn-primary btn-round Provides extra visual weight and identifies the primary action in a set of buttons
btn btn-info btn-round Used as an alternative to the default styles
btn btn-success btn-round Indicates a successful or positive action
btn btn-warning btn-round Indicates caution should be taken with this action
btn btn-danger btn-round Indicates a dangerous or potentially negative action
btn btn-link btn-round Deemphasize a button by making it look like a link while maintaining button behavior
Button class="" Description
btn btn-outline-default Standard gray button with gradient
btn btn-outline-primary Provides extra visual weight and identifies the primary action in a set of buttons
btn btn-outline-info Used as an alternative to the default styles
btn btn-outline-success Indicates a successful or positive action
btn btn-outline-warning Indicates caution should be taken with this action
btn btn-outline-danger Indicates a dangerous or potentially negative action
Disabled State
.btn .btn-primary .disabled
.btn .btn-default .disabled
.btn .btn-success .disabled
.btn .btn-danger .disabled
.btn .btn-warning .disabled
.btn .btn-info .disabled
.btn .btn-light .disabled
.btn .btn-dark .disabled
.btn .btn-link .disabled

Button tags

Link

Button group

Button toolbar

@
Nesting
Different Sizing