Pulsante Torna all'inizio
Un pulsante Torna all'inizio dal design minimalista e piatto che si inserisce all'interno di un'interfaccia dashboard. Il pulsante è disegnato in una combinazione di colori monocromatici e include effetti di passaggio del mouse e messa a fuoco per una migliore interattività. È anche reattivo e supporta la modalità oscura.
Codice HTML
<div class="fixed bottom-8 right-8">
<a href="#" class="flex items-center justify-center w-12 h-12 rounded-full bg-gray-600 text-white shadow-lg transition-all ease-in-out duration-300 hover:bg-gray-500 dark:bg-gray-800 dark:hover:bg-gray-700">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
</svg>
</a>
</div>Componenti correlati
Pulsante Torna all'inizio
Un pulsante back-to-top semplice ed elegante che appare fisso nell'angolo in basso a destra dello schermo. Presenta una sottile combinazione di colori pastello e microinterazioni fluide al passaggio del mouse/messa a fuoco. Il pulsante include un design reattivo con supporto integrato per la modalità oscura. Quando si passa il mouse, il pulsante si ingrandisce delicatamente e cambia il colore di sfondo per fornire un feedback visivo. Il componente utilizza solo le classi CSS di Tailwind, senza bisogno di JavaScript.
Pulsante Torna all'inizio
Pulsante Torna all'inizio con design neumorfico, combinazione di colori monocromatici e supporto per la modalità scura. Utilizza Tailwind CSS.
Pulsante Torna all'inizio
Un componente pulsante Torna all'inizio con microinterazioni, combinazione di colori dei toni della terra, layout semplice per siti Web aziendali/aziendali; design reattivo con supporto per la modalità oscura utilizzando Tailwind CSS