Pagination

Accessible pagination navigation with a sliding animated thumb and rolling page numbers for paging through search results and long lists.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Pagination to your project and fits it to your theme.

"use client";

import { Pagination } from "@/components/ui/pagination";

export default function PaginationDemo() {
  return (
    <div className="grid w-full place-items-center py-10">
      <Pagination count={12} defaultPage={1} label="Search results" />
    </div>
  );
}