Tags

A tag is a keyword or term assigned to a piece of information.

Tagin

Simple tag input for Bootstrap.

Basic

Enter a comma-separated list of tags.
Press Comma to add a new tag.

Placeholder

Set placeholder using data-placeholder attribute.

Custom Separator

Set separator using data-separator attribute. Example tags using 'space' separator.
Press Space to add a new tag.

Duplicates

Add data-duplicate="true" to remove duplicates validation.

Transform Tags

Sometimes we need to transform tags. Example transform using toUpperCase.

Bootstrap 5 tags

Replace select[multiple] with nices badges.

Add a new tag

Press Enter to add a new tag.

Validation

Only values from the dropdown are accepted.

Please select a valid tag.
Clear buttons

Add a clear button to remove the selected tag.

Nifty

Background Images

Add an image to replace the solid background color
Layouts
Layouts
Transitions
Header
Additional Offcanvas New in BS v.5.0

Select the offcanvas placement.

Sidebars
Navigation
Right sidebar
Color Schemes
Light Completely bright color themes.
Dark Completely dark color themes.
Expanded Header
Fair Header
Full Header
Primary Nav
Brand
Tall Header New in v3.0
Scrollbars

Hides native scrollbars and creates custom styleable overlay scrollbars.

Offcanvas Header
Content Here

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sapiente eos nihil earum aliquam quod in dolor, aspernatur obcaecati et at. Dicta, ipsum aut, fugit nam dolore porro non est totam sapiente animi recusandae obcaecati dolorum, rem ullam cumque. Illum quidem reiciendis autem neque excepturi odit est accusantium, facilis provident molestias, dicta obcaecati itaque ducimus fuga iure in distinctio voluptate nesciunt dignissimos rem error a. Expedita officiis nam dolore dolores ea. Soluta repellendus delectus culpa quo. Ea tenetur impedit error quod exercitationem ut ad provident quisquam omnis! Nostrum quasi ex delectus vero, facilis aut recusandae deleniti beatae. Qui velit commodi inventore.