brand

Layout

Choose your preferred layout

layoutlayoutlayoutlayoutlayout

Navigation

Menu comes in two modes: dark & light


Top Nav

Choose your liked color mode


Scrollable Header
brandbrand

Pagination

Pagination

Use default Bootstrap markup to display Pagination elements. See the Bootstrap documentation to change alignments & sizes.

Custom pagination

Create fancy pagination using .custom-paginationmodifier class.

Rounded pagination

Use the .pagination-roundedmodifier class to make custom pagination more rounded.

Filled pagination

Use the .pagination-filledmodifier class to make filled pagination.

Simple pagination

Fancy minimal simple style pagination? Create using .pagination-simplemodifier class.

Working with icons

Looking to use an icon or symbol in place of text for some pagination links? Be sure to provide proper screen reader support with aria attributes and the .sr-onlyutility.

Color variations

Simply add .active-*color modifier class with .activeto change colors.

Class Values
class="page-item active active-[value]" primary / success / warning / danger / info / light / dark / red / green / pink / purple / violet / indigo / blue / sky / cyan / teal / neon / lime / sun / yellow / orange / pumpkin / brown / grey / gold / smoke
Alignment

Use justify-contentutility classes to align pagination - center, right & full justified.