Alerts

Static Alerts

A simple success alert example A simple danger alert example A simple warning alert example A simple info alert example

Avatar

Rounded Avatars

Text Avatars

PS

PS

PS

PS

PS

Badge

Badge on Avatar

Badge on icons

3

Button

Example of Buttons

TextButton

Cards

Example of Cards

Example of Vertical Cards with badge and dismiss icon

New

sky

Our Changing Planet

by Kurt Wagner

Visit ten places on our planet that are undergoing the biggest changes today.

sky

Our Changing Planet

by Kurt Wagner

Visit ten places on our planet that are undergoing the biggest changes today.

Example of Text-Overlay Card

Disabled

sky

Our Changing Planet

by Kurt Wagner

Visit ten places on our planet that are undergoing the biggest changes today.

Example of Horizontal Card

sky

Visit ten places on our planet that are undergoing the biggest changes today.

Example of Text Cards

Visit ten places on our planet that are undergoing the biggest changes today.

Image

Responsive image

img-responsive

Rounded & Squared image

img-rounded

img-squared

Input

Example of Form Validation

Javascript Code

Example of Success, Warning & Error Inputs

Success Message

Warning Message

Error Message

Text Utilities

Example of Headings & Paragraphs

Example of H1 heading

Example of H2 heading

Example of H3 heading

Example of H4 heading

Example of H5 heading

Example of a paragraph

Example of Big Heading

Example of Normal Heading

Example of Small Heading

Example of Gray Heading

Example of Small Gray Heading

Example of Text Alignment

Example of center text

Example of left text

Example of right text

Lists

Example of Un-ordered lists

list item 1
list item 2
list item 3

list item 1
list item 2
list item 3

list item 1
list item 2
list item 3

list item 1
list item 2
list item 3

Example of Ordered lists

list item 1
list item 2
list item 3

list item 1
list item 2
list item 3

list item 1
list item 2
list item 3

list item 1
list item 2
list item 3

list item 1
list item 2
list item 3

list item 1
list item 2
list item 3

Example of inline list items

list item 1
list item 2
list item 3

Example of Stacked lists

list item 1
list item 2
list item 3

Slider

Example of Slider

Rating

Example of Rating

4 | 5

Toast

Example of Toast

Success message...

Warning message...

Error message...

Information message...

Simplified Grid

Example of Grid 50-50

Content here

Example of Grid 30-70

Content here

Example of Grid 70-30

Content here

Example of Grid 3 items

Content here