Torna all'inizio Componente pulsante
Un componente Back to Top Button in stile brutalista che utilizza Tailwind CSS. Questo componente ha un design audace e ad alto contrasto e supporta effetti reattivi e tema scuro.
Codice HTML
<div class="fixed bottom-5 right-5">
<a href="#top" class="bg-white dark:bg-gray-800 text-black dark:text-white p-4 rounded-lg shadow-lg font-bold transition-all duration-300 ease-in-out transform hover:scale-105 hover:bg-gray-300 dark:hover:bg-gray-700">
<span class="text-xl">⬆️</span>
</a>
</div>
<style>
/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
body {
background-color: black;
color: white;
}
}
/* General styles */
body {
font-family: 'Courier New', Courier, monospace;
background-color: white;
color: black;
transition: background-color 0.5s, color 0.5s;
}
</style>
Componenti correlati
Pulsante Torna all'inizio
Un pulsante minimalista "Torna all'inizio" con effetti reattivi e supporto per temi scuri utilizzando Tailwind CSS.
Pulsante Torna all'inizio
Componente pulsante con design 3D, combinazione di colori vivaci ed elementi interattivi complessi per interfacce di social media, utilizzando Tailwind CSS. Include un design reattivo e il supporto per i temi scuri.
Torna all'inizio Componente pulsante
Un pulsante reattivo Torna all'inizio progettato in uno stile scheumorfico, con supporto per temi scuri ed effetti reattivi.