Light Blue Documentation

Alert Messages

Alerts are available for any length of text, as well as an optional dismiss button.

Success: You successfully read this important alert message.
Info: This alert needs your attention, but it's not super important.
Warning: Best check yo self, you're not looking too good.
Danger: Change this and that and try again. Ignore Take this action
Badge Example

Badges scale to match the size of the immediate parent element by using relative font sizing and em units.

Example heading Primary

Example heading Info

Example heading Warning

Example heading Success

Example heading Danger
Example heading Secondary

Badges can be used as part of links or buttons to provide a counter.

Color Options

Use any of the available button classes to quickly create a styled button. Semantically distinguishable beauty.

13 Mar

Lifestyle brand

A lifestyle brand is a company that markets its products or services to embody the interests, attitudes, and opinions of a group or a culture. Lifestyle brands seek to inspire, guide, and motivate people, with the goal of their products contributing to the definition of the consumer's way of life.

Full Article
Card image cap

Isometric design

Isometric projection is a method for visually representing three-dimensional in two dimensions in technical and engineering drawings.

Striped Progress

Add .progress-bar-striped to any .progress-bar to apply a stripe via CSS gradient over the progress bar’s background color.

The striped gradient can also be animated. Add .progress-bar-animated to .progress-bar to animate the stripes right to left via CSS3 animations.