Volver al principio Componente de botón
Un componente de botón Volver al principio de estilo brutalista que usa Tailwind CSS. Este componente tiene un diseño audaz y de alto contraste y admite efectos responsivos y tema oscuro.
Código 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>Componentes relacionados
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
Volver al principio Componente de botón
Un botón de regreso al principio receptivo diseñado con microinteracciones y colores vibrantes, adecuado para una interfaz de tablero con soporte de modo oscuro.
Botón Volver al principio
Un botón minimalista 'Back to Top' con efectos responsivos y soporte de temas oscuros usando Tailwind CSS.