Navigate between muitple pages of records.
The Pagination component shows a series of related content split across multiple pages. It allows an end user to navigate between these pages of records.
The Pagination component is best used for large lists and tables.
- Page Action. This allows the user to quickly jump to a specific page of records.
- Prev/Next. These buttons move the page number by +/-1.
Sizing & Spacing
The Pagination component is of fixed size.
States (if applicable)
Multiple sub-components of the Pagination component have many different states. The Page Action buttons have
active states, whereas the Prev/Next buttons have default and hover.
Hierarchy & Placement
The Pagination component should be placed above and below a table or list and aligned to the right-hand side. Do not nest the Pagination component. If another level is required, direct the user to a new page.