Large buttons

<button type="button" class="btn btn-default btn-lg">Default</button>


<button type="button" class="btn btn-primary btn-lg">Primary</button>


<button type="button" class="btn btn-success btn-lg">Success</button>


<button type="button" class="btn btn-info btn-lg">Info</button>


<button type="button" class="btn btn-warning btn-lg">Warning</button>


<button type="button" class="btn btn-danger btn-lg">Danger</button>

Normal buttons

<button type="button" class="btn btn-default">Default</button>


<button type="button" class="btn btn-primary">Primary</button>


<button type="button" class="btn btn-success">Success</button>


<button type="button" class="btn btn-info">Info</button>


<button type="button" class="btn btn-warning">Warning</button>


<button type="button" class="btn btn-danger">Danger</button>

Small buttons

<button type="button" class="btn btn-default btn-sm">Default</button>


<button type="button" class="btn btn-primary btn-sm">Primary</button>


<button type="button" class="btn btn-success btn-sm">Success</button>


<button type="button" class="btn btn-info btn-sm">Info</button>


<button type="button" class="btn btn-warning btn-sm">Warning</button>


<button type="button" class="btn btn-danger btn-sm">Danger</button>

Extra small buttons

<button type="button" class="btn btn-default btn-xs">Default</button>


<button type="button" class="btn btn-primary btn-xs">Primary</button>


<button type="button" class="btn btn-success btn-xs">Success</button>


<button type="button" class="btn btn-info btn-xs">Info</button>


<button type="button" class="btn btn-warning btn-xs">Warning</button>


<button type="button" class="btn btn-danger btn-xs">Danger</button>

Large buttons with icons

<button type="button" class="btn btn-default btn-lg"><i title="icon-thumbs-up" class="icon fontello icon-thumbs-up" aria-hidden="true"></i>Default</button>

<button type="button" class="btn btn-primary btn-lg"><i title="icon-trophy" class="icon fontello icon-trophy" aria-hidden="true"></i>Primary</button>

<button type="button" class="btn btn-success btn-lg"><i title="icon-check" class="icon fontello icon-check" aria-hidden="true"></i>Success</button>

<button type="button" class="btn btn-info btn-lg"><i title="icon-info" class="icon fontello icon-info" aria-hidden="true"></i>Info</button>

<button type="button" class="btn btn-warning btn-lg"><i title="icon-bell" class="icon fontello icon-bell" aria-hidden="true"></i>Warning</button>

<button type="button" class="btn btn-danger btn-lg"><i title="icon-attention" class="icon fontello icon-attention" aria-hidden="true"></i>Danger</button>

Normal buttons with icons

<button type="button" class="btn btn-default"><i title="icon-thumbs-up" class="icon fontello icon-thumbs-up" aria-hidden="true"></i>Default</button>

<button type="button" class="btn btn-primary"><i title="icon-trophy" class="icon fontello icon-trophy" aria-hidden="true"></i>Primary</button>

<button type="button" class="btn btn-success"><i title="icon-check" class="icon fontello icon-check" aria-hidden="true"></i>Success</button>

<button type="button" class="btn btn-info"><i title="icon-info" class="icon fontello icon-info" aria-hidden="true"></i>Info</button>

<button type="button" class="btn btn-warning"><i title="icon-bell" class="icon fontello icon-bell" aria-hidden="true"></i>Warning</button>

<button type="button" class="btn btn-danger"><i title="icon-attention" class="icon fontello icon-attention" aria-hidden="true"></i>Danger</button>

Small buttons with icons

<button type="button" class="btn btn-default btn-sm"><i title="icon-thumbs-up" class="icon fontello icon-thumbs-up" aria-hidden="true"></i>Default</button>

<button type="button" class="btn btn-primary btn-sm"><i title="icon-trophy" class="icon fontello icon-trophy" aria-hidden="true"></i>Primary</button>

<button type="button" class="btn btn-success btn-sm"><i title="icon-check" class="icon fontello icon-check" aria-hidden="true"></i>Success</button>

<button type="button" class="btn btn-info btn-sm"><i title="icon-info" class="icon fontello icon-info" aria-hidden="true"></i>Info</button>

<button type="button" class="btn btn-warning btn-sm"><i title="icon-bell" class="icon fontello icon-bell" aria-hidden="true"></i>Warning</button>

<button type="button" class="btn btn-danger btn-sm"><i title="icon-attention" class="icon fontello icon-attention" aria-hidden="true"></i>Danger</button>

Extra small buttons with icons

<button type="button" class="btn btn-default btn-xs"><i title="icon-thumbs-up" class="icon fontello icon-thumbs-up" aria-hidden="true"></i>Default</button>

<button type="button" class="btn btn-primary btn-xs"><i title="icon-trophy" class="icon fontello icon-trophy" aria-hidden="true"></i>Primary</button>

<button type="button" class="btn btn-success btn-xs"><i title="icon-check" class="icon fontello icon-check" aria-hidden="true"></i>Success</button>

<button type="button" class="btn btn-info btn-xs"><i title="icon-info" class="icon fontello icon-info" aria-hidden="true"></i>Info</button>

<button type="button" class="btn btn-warning btn-xs"><i title="icon-bell" class="icon fontello icon-bell" aria-hidden="true"></i>Warning</button>

<button type="button" class="btn btn-danger btn-xs"><i title="icon-attention" class="icon fontello icon-attention" aria-hidden="true"></i>Danger</button>