Home
Livia Flores
Pagination round buttons

Pagination round buttons

This tailwind example is contributed by Livia Flores, on 07-Apr-2023. Component is made with Tailwind CSS v3. It is responsive.

Pagination

Author Livia Flores

11.7k

14

Fork Fullscreen

<div class="flex justify-center">
    <nav class="bg-gray-200 rounded-full px-4 py-2">
        <ul class="flex text-gray-600 gap-4 font-medium py-2">
            <li>
                <a href="#" class="rounded-full px-4 py-2 bg-white text-gray-600">1</a>
            </li>
            <li>
                <a href="#"
                    class="rounded-full px-4 py-2 hover:bg-white hover:text-gray-600 transition duration-300 ease-in-out">2</a>
            </li>
            <li>
                <a href="#"
                    class="rounded-full px-4 py-2 hover:bg-white hover:text-gray-600 transition duration-300 ease-in-out">3</a>
            </li>
            <li>
                <a href="#"
                    class="rounded-full px-4 py-2 hover:bg-white hover:text-gray-600 transition duration-300 ease-in-out">4</a>
            </li>
            <li>
                <a href="#"
                    class="rounded-full px-4 py-2 hover:bg-white hover:text-gray-600 transition duration-300 ease-in-out">5</a>
            </li>
        </ul>
    </nav>
</div>

Related Examples

Simple rounded pagination
It has a minimalistic look with options to go to the previous and next pages and click on specific page numbers.

Author:
Diego Chavez

2 years ago

7.5k
Button group

Author:
Conan Hilton

3 years ago

8.8k
Pagination

Author:
Prem..

3 years ago

11.3k
Simple Pagination

Author:
Manuela Bianka

3 years ago

11.8k
Pagination

Author:
Sienna

2 years ago

10.5k
Pagination

Author:
Leon Bachmann

2 years ago

10.1k
Pagination - Htmlwind
Centered numbers pagination

Author:
Htmlwind

4 months ago

464
Pagination

Author:
Lîmåã M

2 years ago

11.1k
AcodeMaster GameZone – Play Your Favorite Games Online
AcodeMaster GameZone is a modern gaming website where you can discover, explore, and play exciting games anytime, anywhere. Designed with smooth animations and a stylish dark theme using Tailwind CSS, it offers a fast and fun experience for every gamer.

Author:
Code Master(Mfuranziza Dusabe Hamza)

5 months ago

732
SomaRwanda
Menya uburyo bwo kwandika ibisomwa, impuzandimi, n'imyandikire y'icyongereza mu buryo bworoshye.

Author:
Code Master(Mfuranziza Dusabe Hamza)

4 months ago

702
macOS Style Webpage – macOS Design in the Browser
A simple webpage inspired by the macOS interface. It recreates the clean design, dock, and desktop look of macOS using only HTML, tailwind CSS, and JavaScript. This project focuses on front-end styling and layout to bring the visual feel of macOS to the web — not a full simulation, just the look and vibe.

Author:
Hamza Atig

4 days ago

85
Basic pagination

Author:
Sophia Baker

2 years ago

12.2k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components

TailwindFlex.com

Tailwindflex.com is a free Tailwind CSS examples library. It's a one-stop destination for ready-made Tailwind CSS components and templates.

Contact

Email: admin@tailwindflex.com

Resources

Tailwind CSS Gradient Generator Free Bootstrap CSS Components Free CSS Components

© 2025 TailwindFlex. All Rights Reserved.

v1.12