Pagination
Mon, June 29, 2026

Pagination

A multi-page navigation component designed for traversing tables, data grids, patient queues, and laboratory catalogs with high-end sizing, alignment, and corner rounding styles.

Default & Rounded Pagination
Default Pagination (Clean Borders)
Rounded Pagination (Pill Circles)
Disabled and Active States

Add .active to highlight the current page, and .disabled to block interactive page actions on boundary limits.

Boundary Start (Previous Disabled)
Boundary End (Next Disabled, Rounded)
Sizing Variations

Add sizing modifiers such as .pagination-lg or .pagination-sm to scale components vertically and horizontally.

Large Sizing (.pagination-lg)
Small Sizing (.pagination-sm)
Alignment Configurations

Modify block layouts using basic utility classes to align pagination panels to the left, center, or right.

Center Alignment (justify-content-center)
Right Alignment (justify-content-end)