Componentes Botón Volver al principio Botón Volver al principio

Botón Volver al principio

Un botón Volver al principio minimalista y de diseño plano que cabe dentro de la interfaz de un tablero. El botón está diseñado en un esquema de color monocromático e incluye efectos de desplazamiento y enfoque para una mejor interactividad. También es sensible y admite el modo oscuro.

Vista previa

Código 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>

Componentes relacionados

Botón Volver al principio

Botón Volver al principio con diseño neumórfico, combinación de colores monocromática y compatibilidad con el modo oscuro. Utiliza Tailwind CSS.

Abrir

Volver arriba Botón Minimalista Vibrante

Un componente de botón Volver al principio mínimo y plano con colores vibrantes, adecuado para un sitio web de portafolio. Incluye diseño responsivo y soporte para el modo oscuro usando Tailwind CSS.

Abrir

Botón Volver al principio

Un botón Volver al principio de Material Design que aparece cuando el usuario se desplaza hacia abajo en la página. Incluye soporte para modo oscuro y desplazamiento suave.

Abrir