Pagination blocks

Pagination is the row of controls at the foot of a long set that says which slice is on screen and moves the reader to another one.

Get Pro to installPro18 blocksReact, Vue and Figma

Page 10 of 20·181–200 of 388 orders

Every block in the set#

A tight row where the ends need to be reachable rather than explained

A narrow footer: one number, its total, and a way to jump straight to a page

A footer with room for words: Previous and Next survive translation and a screen reader better

Long sets where paging one at a time is not the point: type the page and go

The other half of paging: how many rows a page is, before which page you are on

A screen where moving between pages is the main thing happening

A tight row where the motion should say which way you went

Sets where the middle pages matter as much as the neighbours

A narrow footer where people know the page they want

A compact pager that also shows how far through the set you are

Docs and long reads where the next page has a name

Feeds and long lists where pages are an implementation detail

Long sets where people type the page and want to see it is valid first

Alphabetical sets where people remember a surname, not a page number

Data tables that need the footer everyone expects

Tables people read down, where a new page size should not lose the row

Readers who mostly go forward

A short set where the shape of the whole thing is worth seeing

A result set long enough that people jump to a page rather than scroll to one.
Under a table, where the reader also has to choose how many rows a page is.
Queries paged on the server, where a page is a request rather than a slice of something already loaded.
A position that has to survive a reload, a shared link or a colleague reading it out.

The whole set, with its codePro

Pro opens the Code tab on every block here, in React and Vue, plus the Figma file and the MCP server for your editor.