Shadcn.io is not affiliated with official shadcn/ui
With Ellipsis
A pagination component using PaginationEllipsis to show page jumps, displaying pages 1-3, ellipsis, then page 10 for large datasets
When you have dozens of pages—show the important ones. This React pagination displays pages 1-3 (page 2 active), PaginationEllipsis indicating skipped pages, then page 10 (last page). Built with shadcn/ui Pagination and Radix UI primitives, ellipsis handles large datasets—perfect for search results (hundreds of items), content archives, product catalogs, or any pagination where showing all pages would overwhelm users but they need access to boundaries and nearby pages.
With Ellipsis preview
Installation
Related Components
Complete Pagination
Full pagination with all controls
Five Page Numbers
Pagination without ellipsis
With Previous and Next
Navigation button pagination
Table Pagination
Data table pagination
Dropdown Menu
Page jump dropdown
Select
Page selector component
FAQ
Was this page helpful?
Sign in to leave feedback.
With Previous and Next
A pagination component with Previous and Next navigation buttons flanking 3 numbered pages for sequential navigation control
Complete Pagination
A full-featured pagination component combining Previous/Next buttons, numbered pages 1-3, ellipsis, and last page 10 for comprehensive navigation