Botón Volver al principio
Un componente de botón Volver al principio con microinteracciones, combinación de colores en tonos tierra, diseño simple para sitios web comerciales / corporativos; diseño responsivo con soporte de modo oscuro usando Tailwind CSS
Código HTML
<!-- Back to Top Button Component -->
<a href="#top" class="fixed bottom-6 right-6 flex items-center justify-center w-12 h-12 bg-emerald-700 text-white rounded-full shadow-lg transform transition-transform duration-200 hover:scale-110 hover:bg-emerald-600 dark:bg-emerald-600 dark:hover:bg-emerald-500" aria-label="Back to Top">
<span class="sr-only">Back to Top</span>
<svg class="w-6 h-6" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 15l7-7 7 7"/>
</svg>
</a>
<!-- To enable smooth scrolling behavior across the page, add the `scroll-smooth` class to your `<html>` element: -->
<!-- <html class="scroll-smooth"> -->Componentes relacionados
Volver al principio Componente de botón
Un botón "Volver al principio" simple y artístico diseñado para sitios web de alimentos / restaurantes, con una estética en escala de grises inspirada en la acuarela. Es responsivo y admite el modo oscuro.
Volver al principio Componente de botón
Un componente de botón 'Volver al principio' receptivo diseñado para el comercio electrónico, con una combinación de colores vibrantes sobre un fondo oscuro. Incluye un sutil efecto de desplazamiento y garantiza la visibilidad en todos los tamaños de pantalla con soporte para el modo oscuro.
Volver al principio Componente de botón
Un componente de botón 'Volver al principio' receptivo diseñado con principios de diseño de materiales, colores apagados y compatibilidad con modo oscuro, adecuado para blogs o sitios web de consumo de contenido.