Componente di impaginazione
Componente di impaginazione reattiva con supporto per 3D, colore triadico, semplice, stile Business/Corporate e modalità scura
Codice HTML
<nav aria-label="Pagination" class="flex justify-center items-center space-x-2 dark:bg-gray-800 p-4 rounded-md">
<a href="#" class="px-3 py-2 bg-blue-600 text-white rounded-md dark:bg-blue-800 dark:text-gray-200 transform transition duration-300 ease-in-out hover:scale-110">Previous</a>
<a href="#" class="px-3 py-2 bg-green-500 text-white rounded-md dark:bg-green-700 dark:text-gray-200 transform transition duration-300 ease-in-out hover:scale-110">1</a>
<a href="#" aria-current="page" class="px-3 py-2 bg-red-600 text-white rounded-md dark:bg-red-800 dark:text-gray-200 transform transition duration-300 ease-in-out hover:scale-110">2</a>
<a href="#" class="px-3 py-2 bg-green-500 text-white rounded-md dark:bg-green-700 dark:text-gray-200 transform transition duration-300 ease-in-out hover:scale-110">3</a>
<a href="#" class="px-3 py-2 bg-blue-600 text-white rounded-md dark:bg-blue-800 dark:text-gray-200 transform transition duration-300 ease-in-out hover:scale-110">Next</a>
</nav>Componenti correlati
Impaginazione e-commerce
Un componente di impaginazione reattivo ispirato al Material Design con supporto per il tema scuro, adatto per elenchi di prodotti di e-commerce. Implementa una combinazione di colori complementari e una complessità moderata con stati dei pulsanti interattivi utilizzando solo HTML e Tailwind CSS.
LuxuryPaginationComponent
Un componente di impaginazione elegante e sofisticato progettato per la documentazione o i siti wiki, caratterizzato da un tocco di lusso/premium, combinazione di colori complementari e ricchi elementi interattivi. Completamente reattivo con supporto per la modalità oscura.
Componente di impaginazione
Componente di impaginazione con microinterazioni per un portfolio, utilizzando uno schema di colori triadico. Design reattivo con supporto per temi scuri, senza JavaScript.