Loading. Please Wait.

#### Switchers

Switchery is a simple component that helps you turn your default HTML checkbox inputs into beautiful iOS 7 style switches in just few simple steps. You can easily customize switches, so that they match your design perfectly.

##### Basic Switchers

For existing `<input>` just add a class `.js-switch`.

Examples

On
Off
On Disabled
Off Disabled

##### Colors Variations

For existing `<input>` just add a class `.js-switch-primary` , `.js-switch-info` etc.

Examples

Switch Primary
Switch Info
Switch Success
Switch Warning
Switch Danger

##### Sizes

For existing `<input>` just add a class `."js-switch-small` or `.js-switch-large` .

Examples

Switch Small
Switch Default
Switch Large

#### Bootstrap Select

Bootstrap-select is a jQuery plugin that utilizes Bootstrap's dropdown.js to style and bring additional functionality to standard select elements.

##### Standard Select Boxes

example

##### Select Boxes with Optgroups

example

##### Select Boxes with Optgroups

You can also show the checkmark icon on standard select boxes with the `show-tick` class:

example

##### Menu Arrow

The Bootstrap menu arrow can be added with the `show-menu-arrow` class:

example

##### Button Classes

You can set the button classes via the `data-style` attribute:

examples

##### Limit the Number of Selections

Limit the number of options that can be selected via the `data-max-options` attribute. It also works for option groups. Customize the message displayed when the limit is reached with `maxOptionsText`.

examples

##### Selected Text Format

Specify how the selection is displayed with the `data-selected-text-format` attribute on a multiple select.

examples

##### Custom Content

Insert custom HTML into the option with the `data-content` attribute:

example

##### Live Search

You can add a search input by passing `data-live-search="true"` attribute:

examples

##### Subtext

Add subtext to an option or optgroup with the `data-subtext` attribute:

example

##### Icons

Add an icon to an option or optgroup with the `data-icon` attribute:

example

##### Select/Deselect All Options

Adds two buttons to the top of the menu - Select All & Deselect All with `data-actions-box="true"`.

example

#### Select 2 with Select2 Theme

Select2 gives you a customizable select box with support for searching, tagging, remote data sets, infinite scrolling, and many other highly used options.

##### Single select boxes

Select2 can take a regular select box like this...

example

##### Multiple select boxes

Select2 also supports multi-value select boxes. The select below is declared with the `multiple` attribute.

example

##### Select Success

Example

##### Select Warning

example

##### Select Danger

Example

##### Disabled mode

Select2 will respond to the `disabled` attribute on `<select>` elements. You can also initialize Select2 with `disabled: true` to get the same effect.

Example

##### Select2 Append Checkbox

Example

##### Select2 Multi Append Radiobutton

Example

##### Select2 Append

Example

##### Select2 Prepend

Example

##### Select2 Multi Append

Example

##### Select2 Multi Prepend

Example

Navbar Options

Show/Hide Fixed

Header Layout

Show/Hide

Sidebar Options

Show/Hide
Fixed Aside

Content View

Footer Options

Show/Hide Fixed

Main Color

Primary
Info
Success
Warning
Danger

Navbar

Dark
Light
Like Main Color

Sidebar

Dark
Light
Like Main Color