AdminLTE
Toggle navigation
  • 4
    • You have 4 messages
      • User Image

        Support Team 5 mins

        Why not buy a new awesome theme?

      • user image

        AdminLTE Design Team 2 hours

        Why not buy a new awesome theme?

      • user image

        Developers Today

        Why not buy a new awesome theme?

      • user image

        Sales Department Yesterday

        Why not buy a new awesome theme?

      • user image

        Reviewers 2 days

        Why not buy a new awesome theme?

    • See All Messages
  • 10
    • You have 10 notifications
      • 5 new members joined today
      • Very long description here that may not fit into the page and may cause design problems
      • 5 new members joined
      • 25 sales made
      • You changed your username
    • View all
  • 9
    • You have 9 tasks
      • Design some buttons 20%

        20% Complete
      • Create a nice theme 40%

        40% Complete
      • Some task I need to do 60%

        60% Complete
      • Make beautiful transitions 80%

        80% Complete
    • View all tasks
  • Jane Doe
    • User Image

      Jane Doe - Web Developer Member since Nov. 2012

    • Followers
      Sales
      Friends
    • Profile
      Sign out
User Image

Hello, Jane

Online
  • Dashboard
  • Widgets new
  • Charts
    • Morris
    • Flot
    • Inline charts
  • UI Elements
    • General
    • Icons
    • Buttons
    • Sliders
    • Timeline
  • Forms
    • General Elements
    • Advanced Elements
    • Editors
  • Tables
    • Simple tables
    • Data tables
  • Calendar 3
  • Mailbox 12
  • Examples
    • Invoice
    • Login
    • Register
    • Lockscreen
    • 404 Error
    • 500 Error
    • Blank Page

General UI Preview of UI elements

  1. Home
  2. Blank page

Alerts and Callouts

Alerts

Alert! Danger alert preview. This alert is dismissable. A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.
Alert! Info alert preview. This alert is dismissable.
Alert! Warning alert preview. This alert is dismissable.
Alert! Success alert preview. This alert is dismissable.

Callouts

I am a danger callout!

There is a problem that we need to fix. A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.

I am an info callout!

Follow the steps to continue to payment.

I am a warning callout!

This is a yellow callout.

AdminLTE Custom Tabs

  • Tab 1
  • Tab 2
  • Dropdown
    • Action
    • Another action
    • Something else here
    • Separated link
How to use:

Exactly like the original bootstrap tabs except you should use the custom wrapper .nav-tabs-custom to achieve this style.

A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. I am so happy, my dear friend, so absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke at the present moment; and yet I feel that I never was a greater artist than now.
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ in their grammar, their pronunciation and their most common words. Everyone realizes why a new common language would be desirable: one could refuse to pay expensive translators. To achieve this, it would be necessary to have uniform grammar, pronunciation and more common words. If several languages coalesce, the grammar of the resulting language is more simple and regular than that of the individual languages.
  • Tab 1
  • Tab 2
  • Dropdown
    • Action
    • Another action
    • Something else here
    • Separated link
  • Custom Tabs
How to use:

Exactly like the original bootstrap tabs except you should use the custom wrapper .nav-tabs-custom to achieve this style.

A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. I am so happy, my dear friend, so absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke at the present moment; and yet I feel that I never was a greater artist than now.
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ in their grammar, their pronunciation and their most common words. Everyone realizes why a new common language would be desirable: one could refuse to pay expensive translators. To achieve this, it would be necessary to have uniform grammar, pronunciation and more common words. If several languages coalesce, the grammar of the resulting language is more simple and regular than that of the individual languages.

Progress Bars

Progress Bars Different Sizes

No class
40% Complete (success)
Class: .sm
20% Complete
Class: .xs
60% Complete (warning)

Progress bars

40% Complete (success)
20% Complete
60% Complete (warning)
80% Complete

Vertical Progress Bars Different Sizes

By adding the class .vertical and .xs or .sm we achieve:

40%
20%
60%

Vertical Progress bars

By adding the class .vertical we achieve:

40%
20%
60%
80%

Bootstrap Accordion & Carousel

Collapsible Accordion

Collapsible Group Item #1

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.

Collapsible Group Danger

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.

Collapsible Group Success

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.

Carousel

First slide
First Slide
Second slide
Second Slide
Third slide
Third Slide

Typography

Headlines

h1. Bootstrap heading

h2. Bootstrap heading

h3. Bootstrap heading

h4. Bootstrap heading

h5. Bootstrap heading
h6. Bootstrap heading

Text Emphasis

Lead to emphasize importance

Text green to emphasize success

Text aqua to emphasize info

Text light blue to emphasize info (2)

Text red to emphasize danger

Text yellow to emphasize warning

Text muted to emphasize general

Block Quotes

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title

Block Quotes Pulled Right

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title

Unordered List

  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit
  • Integer molestie lorem at massa
  • Facilisis in pretium nisl aliquet
  • Nulla volutpat aliquam velit
    • Phasellus iaculis neque
    • Purus sodales ultricies
    • Vestibulum laoreet porttitor sem
    • Ac tristique libero volutpat at
  • Faucibus porta lacus fringilla vel
  • Aenean sit amet erat nunc
  • Eget porttitor lorem

Ordered Lists

  1. Lorem ipsum dolor sit amet
  2. Consectetur adipiscing elit
  3. Integer molestie lorem at massa
  4. Facilisis in pretium nisl aliquet
  5. Nulla volutpat aliquam velit
    1. Phasellus iaculis neque
    2. Purus sodales ultricies
    3. Vestibulum laoreet porttitor sem
    4. Ac tristique libero volutpat at
  6. Faucibus porta lacus fringilla vel
  7. Aenean sit amet erat nunc
  8. Eget porttitor lorem

Unstyled List

  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit
  • Integer molestie lorem at massa
  • Facilisis in pretium nisl aliquet
  • Nulla volutpat aliquam velit
    • Phasellus iaculis neque
    • Purus sodales ultricies
    • Vestibulum laoreet porttitor sem
    • Ac tristique libero volutpat at
  • Faucibus porta lacus fringilla vel
  • Aenean sit amet erat nunc
  • Eget porttitor lorem

Description

Description lists
A description list is perfect for defining terms.
Euismod
Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
Donec id elit non mi porta gravida at eget metus.
Malesuada porta
Etiam porta sem malesuada magna mollis euismod.

Description Horizontal

Description lists
A description list is perfect for defining terms.
Euismod
Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
Donec id elit non mi porta gravida at eget metus.
Malesuada porta
Etiam porta sem malesuada magna mollis euismod.
Felis euismod semper eget lacinia
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.