Dropdowns

Single Button Dropdown

Use btn class at to create a dropdown toggle with <button> element.

Next.js Preview

Dropdown Color Variant

Use btn- class with below mentioned variation to color dropdown toggle.

Next.js Preview

Split Button Dropdown

Use dropdown-toggle-split to create split button dropdowns as a single button dropdown.

Next.js Preview

Dropdown Sizing

Use btn-lg class to create a large size dropdown button and btn-sm to create a small size dropdown button.

Next.js Preview

Dark Dropdowns

Use dropdown-menu-dark class onto an existing dropdown-menu to create dropdown items dark.

Next.js Preview

Alignment options

Dropdown demo with various dropdown alignment options.

Next.js Preview

Dropdown Options

Use data-bs-offset ordata-bs-reference to change the position of the dropdown.

Next.js Preview

Auto Close Behavior

By default, the dropdown menu is closed when clicking inside or outside the dropdown menu. You can use the autoClose option to change this behavior of the dropdown.

Next.js Preview

Dropdown Menu Item Color

Example of dropdown menu and dropdown item color.

Dropdown Menu link Color example

Dropdown menu Primary link

Dropdown menu Secondary link

Dropdown menu Success link

Dropdown menu Warning link

Dropdown menu Info link

Dropdown menu Danger link

Next.js Preview

Menu Content

Example of dropdown menu containingHeaders, Text and Forms content.

Next.js Preview
2023 © Hybrix.
Design & Develop by Themesbrand