Componenti Pulsante Torna all'inizio Torna all'inizio Componente pulsante

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.

Anteprima

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.

Aperto

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.

Aperto

Torna all'inizio Componente pulsante

Un pulsante reattivo Torna all'inizio progettato in uno stile scheumorfico, con supporto per temi scuri ed effetti reattivi.

Aperto