[ bracket ]

While not always necessary, sometimes you need to put your DOM in a box. For those situations, try the panel component.

Basic Panel

By default, all the .panel does is apply some basic border and padding to contain some content.

Basic panel example

Panel With Heading

Easily add a heading container to your panel with .panel-heading. You may also include any h1 - h6 with a .panel-title class to add a pre-styled heading.

Panel Title

Panel content
Panel With Footer

Wrap content in .panel-footer. Note that panel footers do not inherit colors and borders when using contextual variations as they are not meant to be in the foreground.

Panel content
Contextual Alternatives

Like other components, easily make a panel more meaningful to a particular context by adding any of the contextual state classes.

Panel Title

Panel content

Panel Title

Panel content

Panel Title

Panel content

Panel Title

Panel content

Panel Title

Panel content

Panel Title

Panel content
Panel Header Alternative

Like other components, easily make a panel more meaningful to a particular context by adding any of the contextual state classes.

Panel Title

Some description goes here...

Panel content

Panel Title

Some description goes here...

Panel content
Available Widgets

Below are some predesigned widgets that may be useful in your projects. You can put this somewhere in your web pages (ie. dashboard, sidebar).

Messaging

  • Dec 10

    Jennier Lawrence

    Lorem ipsum dolor sit amet...
  • Dec 9

    Marsha Mellow

    Lorem ipsum dolor sit amet...
  • Dec 9

    Holly Golightly

    Lorem ipsum dolor sit amet...
100x100

Enhanced Checkboxes

Voluptatem quia voluptas sit aspernatur aut consectetur odit aut...
100x100

Textbox Field

Voluptatem quia voluptas sit aspernatur aut consectetur odit aut...
100x100

Creating Dropdown Menu

Voluptatem quia voluptas sit aspernatur aut consectetur odit aut...
100x100

John Doe in Adding Touch...

Voluptatem quia voluptas sit aspernatur aut consectetur odit aut...
100x100

Jane Smith in Grab Info From...

Voluptatem quia voluptas sit aspernatur aut consectetur odit aut...
100x100

Donald Frank in jQuery Form...

Voluptatem quia voluptas sit aspernatur aut consectetur odit aut...
Cover Photo
80x80

Edsger Dijkstra

San Francisco, California
If debugging is the process of removing software bugs, then programming must be the process of putting them in.
1,100 Followers
36 Following

Subscribe To Newsletter

Sign up below to receive all the latest updates & news from us.

Strawhat In The Beach

San Franciso, California, USA By: ThemePixels

18

  San Francisco
1.0mm
30mph
Content Slider
Slider With Indicators

Quick Status Post

Fri, Dec 13

4:50AM PST

Average Sales

$630,201

Total Sales

$139,201

To-Do List Widget

Online Users
  • Eileen Sideways Los Angeles, CA
  • 2 Zaham Sindilmaca San Francisco, CA
  • Nusja Nawancali Bangkok, Thailand
  • Renov Leongal Cebu City, Philippines
  • Weno Carasbong Tokyo, Japan
Offline Users
  • Eileen Sideways Los Angeles, CA
  • Zaham Sindilmaca San Francisco, CA
  • Nusja Nawancali Bangkok, Thailand
  • Renov Leongal Cebu City, Philippines
  • Weno Carasbong Tokyo, Japan
  • Renov Leongal Cebu City, Philippines
  • Weno Carasbong Tokyo, Japan
Favorites
  • Eileen Sideways Los Angeles, CA
  • Zaham Sindilmaca San Francisco, CA
  • Nusja Nawancali Bangkok, Thailand
  • Renov Leongal Cebu City, Philippines
  • Weno Carasbong Tokyo, Japan
History
  • Eileen Sideways Hi hello, ctc?... would you mind if I go to your...
  • Zaham Sindilmaca This is to inform you that your product that we...
  • Nusja Nawancali Are you willing to have a long term relat...
Settings