@clayui/pagination

---

title: 'Pagination' description: 'Pagination provides horizontal navigation between chunks(pages) of a dataset.' lexiconDefinition: 'https://liferay.design/lexicon/core-components/pagination/' packageNpm: '@clayui/pagination'

import { Pagination, PaginationWithBasicItems, } from '$packages/clay-pagination/docs/index';

• Numbered Pagination

You can use ClayPagination.Ellipsis to display a dropdown with the specified page numbers as the dropdown's options.

ClayPagination.Item renders a basic Pagination item with content you provide.

Combining these you can reach the following result:

Numbered Pagination

If you want to have a simple Pagination with integers as Pagination items you can use a simpler variant, PaginationWithBasicItems as you can see below: