Primary Colors

#18879B

#454546

#888888

#D9D9D9

#EEEEEE

State Colors

Success

#6C9B41

#557733

#537732

Info

#2FC7E2

#1896AC

#1bAAC3

Warning

#E77E23

#AB5913

#C26515

Danger

#D95347

#AF3024

#C43529

Secondary Colors

#E74C3C

#59B3A4

#F1C40F

#C0392B

#7F4E76

#F39C12

#3498DB

#75CABE

#573755

#2ECC71

#2980B9

H1 Heading 56px small

H2 Heading 44px small

H3 Heading 32px small

H4 Heading 24px small

H5 Heading 20px small

H6 Heading 16px small

.lead
b (bold)
strong

small
.small

em
i (italic)

~~del~~
~~s (strikethrough)~~
ins
u (underline)

code
var
samp

mark
kbd

.text-left

.text-center

.text-right

.text-justify

.text-lowercase .text-uppercase .text-capitalize

abbr .initialism

address strong
address
first.last@example.com

blockquote p

footer cite

blockquote.blockquote-reverse p

Someone famous in Source Title

li
List item
- ul li
- List item
List item

List item
List item
1. List item
2. List item
List item

ul.list-unstyled

List item
List item
- List item
- List item
List item

ul.list-inline

List item
List item
List item

dt: dd
Term: Description
Description

dl.dl-horizontal

Term: Description
Long term will be truncated: Description
Description

Solid Buttons

Default Button

Primary Button

Inverse Button

Success Button

Info Button

Warning Button

Danger Button

Outline Buttons

Default Button

Primary Button

Inverse Button

Success Button

Info Button

Warning Button

Danger Button

Link Button

Button Sizes

Sample Text Input Example help text that remains unchanged.

Text Input Example help text that remains unchanged.

Password Input Example help text that remains unchanged.

Select option Example help text that remains unchanged.

Multiple Select Option Example help text that remains unchanged.

Textarea Example help text that remains unchanged.

Datepicker Example help text that remains unchanged.

Date Range

Form Sizes

Sample Text Input Large Example help text that remains unchanged.

Sample Text Input Small Example help text that remains unchanged.

Form Inline

Form Horizontal

Validation States

.img-rounded

.img-circle

.img-thumbnail

.img-responsive

Header	Header	Header	Header
Data	Data	Data	Data
Data	Data	Data	Data

Table Striped

Header	Header
Data	Data
Data	Data

Table Bordered

Header	Header
Data	Data
Data	Data

Table Hover

Header	Header
Data	Data
Data	Data

Table Small

Header	Header
Data	Data
Data	Data

Table Large

Header	Header
Data	Data
Data	Data

Table Responsive

Header	Header	Header	Header	Header
Active Cell	Success Cell	Info Cell	Warning Cell	Danger Cell
Active Cell	Applies the hover color to a particular row or cell
Success Cell	Indicates a successful or positive action
Info Cell	Indicates a neutral informative change or action
Warning Cell	Indicates a warning that might need attention
Danger Cell	Indicates a dangerous or potentially negative action

.text-muted .text-primary .text-success .text-info .text-warning .text-danger

.bg-primary .bg-success .bg-info .bg-warning .bg-danger

button.close →

.caret

.clearfix

.pull-left

.pull-right

.center-block: Set an element to display: block and center via margin.

.show and .hidden: Showing and hiding content.
.invisible: Toggle only the visibility of an element.

.sr-only: Hide an element to all devices except screen readers.

.text-hide: Replace an element's text content with a background image.

Color

Typography

H1 Heading 56px small

H2 Heading 44px small

H3 Heading 32px small

H4 Heading 24px small

H5 Heading 20px small

H6 Heading 16px small

Buttons

Forms

Images

Tables

Utilities

Color

Typography

H1 Heading 56px small

H2 Heading 44px small

H3 Heading 32px small

H4 Heading 24px small

H5 Heading 20px small

H6 Heading 16px small

Buttons

Forms

Images

Tables

Utilities

Source Code