Pagination · eight styles

Eight ways to move between pages, stacked as cards: classic squares, pills with an ellipsis window, dots that stretch into a bar, bordered boxes, a track with a sliding runner, a compact odometer, a progress bar and numbered steps. Every one of them works — arrows disable at the ends, the selection animates the way the reference does, and hovering a card lights its number.

What it is

Eight ways to move between the pages of a list — squares, pills, dots, boxes, a sliding track, a compact counter, a progress bar and numbered steps — each one working, with its own small animation when the page changes. A quick way to choose the one that fits a table, a gallery or a checkout.

Full library — live sample, numbers, prompt and source — is for clients. I have the password

Seen in

@海归程序员李工 (Douyin) · 「8 种分页风格供你参考」