Pagination
Navigation controls for paged content — numbered page lists, compact prev/next bars, inline button groups, carousel arrows, and dot/pill indicators.
Button variant
Outlined prev/next buttons frame numbered page items. Use pageShape to toggle between square and circle page buttons.
Link variant
Ghost-style prev/next with no border or shadow — ideal for content-heavy layouts where buttons would add visual noise.
Base variant
Inline connected button-group — Previous, numbered pages separated by dividers, and Next share a single border outline and shadow. Fits compact table footers.
Minimal variant
Hides page numbers entirely. Use pageLabelPlacementto control where “Page X of Y” appears relative to the navigation buttons.
Carousel Arrow
Standalone icon-only nav buttons for carousels and slideshows. Two sizes (sm / md) × four colour variants.
Small
Medium
Pagination Indicator
Dot and pill indicators for carousels. Click any demo below to cycle the active position.
Dot
Pill