Pagination

  1. Components
  2. Pagination

Circular controls

Round page controls with compact spacing.

Page 1 of 5

Borderless controls

A lighter treatment for secondary pagination.

Page 1 of 5

Soft background

A quiet surface around the navigation.

Page 1 of 5

Outlined spacing

Separate each page control with a subtle border.

Page 1 of 5

Compact centered pills

Small rounded controls aligned to the center.

Page 1 of 5

Wide page toolbar

Page navigation beside a result summary.

Browse the next set of workspace records.

Page 1 of 5

Numbered pages

Move between a small set of result pages.

Page 1 of 5

Compact pagination

Smaller controls for dense layouts.

Page 1 of 5

Spaced pills

Rounded controls with room between each action.

Page 1 of 5

Centered pagination

A balanced layout below a content collection.

Page 1 of 5

Right-aligned controls

Place page actions at the end of a toolbar.

Page 1 of 5

Document navigation

Previous and next links for related content.

Large controls

Larger targets for spacious interfaces.

Page 1 of 5

Result navigator

Change page and page size for a sample directory.