Botón Volver al principio

Un componente de botón Volver al principio receptivo diseñado con un efecto de morfismo de vidrio, adecuado para sitios web comerciales profesionales. Presenta un diseño simple con elementos mínimos y funciona bien tanto en temas claros como oscuros.

Vista previa

Código HTML

<div class="fixed bottom-5 right-5">
    <a href="#" class="bg-white bg-opacity-30 backdrop-blur-md border border-gray-200 dark:bg-gray-800 dark:bg-opacity-30 dark:border-gray-600 text-gray-800 dark:text-gray-200 rounded-full p-3 shadow-lg hover:shadow-2xl transition-transform transform hover:scale-110">
        <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>

Componentes relacionados

Volver al principio Componente de botón

Un botón Volver al principio responsivo diseñado en un estilo skeuomórfico, con soporte para temas oscuros y efectos responsivos.

Abrir

Botón Volver al principio - Diseño 3D

Un botón Volver al principio con un diseño 3D, efectos responsivos y soporte de temas oscuros usando Tailwind CSS. No se incluye JavaScript.

Abrir

Botón Volver al principio

Un simple botón Volver al principio con diseño de Glassmorphism y esquema de color monocromático para sitios web de comercio electrónico.

Abrir