Shadcn.io is not affiliated with official shadcn/ui
Simple Page Numbers
A minimal pagination component showing 3 numbered page links with active state highlighting using shadcn/ui Pagination
Sometimes you just need page numbers—no arrows, no ellipsis, just 1-2-3. This React pagination shows 3 pages with page 2 active using isActive prop on PaginationLink. Built with shadcn/ui Pagination and Radix UI primitives, it handles the simplest case—short paginated lists, limited datasets, or minimal designs where Previous/Next buttons add unnecessary complexity for just a few pages.
Simple Page Numbers preview
Installation
Related Components
Five Page Numbers
Extended page number range
With Previous and Next
Page numbers plus navigation
Complete Pagination
Full pagination with ellipsis
Button Group
Grouped button actions
Tabs
Tab-based navigation
Breadcrumb
Hierarchical navigation
FAQ
Was this page helpful?
Sign in to leave feedback.