Shadcn.io is not affiliated with official shadcn/ui
Small Size
Compact pagination with small sizing using h-7 w-7 and text-xs for space-constrained layouts built with shadcn/ui
Space is precious—especially on mobile or dense dashboards. This React pagination uses size sm prop with h-7 height, w-7 width, text-xs text, and gap-0.5 spacing for minimal footprint. Built with shadcn/ui and Radix UI, small sizing maintains touch targets while reducing visual weight—perfect for mobile interfaces, table footers, sidebar navigation, or any layout where every pixel counts and users need functional pagination without bulk.
Small Size preview
Installation
Related Components
Default Size
Standard pagination sizing for most use cases
Large Size
Large pagination with h-11 sizing for accessibility
Compact Layout
Minimal pagination without Previous/Next controls
Many Pages
Show all page numbers without ellipsis
Data Table
Paginated table with compact footer
Button Sizes
Button size variants including small
FAQ
Was this page helpful?
Sign in to leave feedback.