Bouton retour en haut
Un composant de bouton Retour en haut avec des micro-interactions, une palette de couleurs de terre, une mise en page simple pour les sites Web d’entreprise ; conception réactive avec prise en charge du mode sombre à l’aide de Tailwind CSS
HTML Code
<!-- 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"> -->Composants associés
Retour en haut du bouton
Un bouton de retour en haut minimaliste et plat qui s’intègre dans l’interface d’un tableau de bord. Le bouton est doté d’une palette de couleurs monochromatiques et comprend des effets de survol et de mise au point pour une meilleure interactivité. Il est également réactif et prend en charge le mode sombre.
Retour en haut du bouton
Un bouton Material Design Back to Top qui apparaît lorsque l’utilisateur fait défiler la page. Il comprend la prise en charge du mode sombre et un défilement fluide.
Retour en haut Bouton - Material Design Pastel
Un composant de bouton réactif « Retour en haut » suivant les principes de Material Design avec une palette de couleurs pastel, adapté à un site web de portfolio. Il inclut un design réactif et la prise en charge du mode sombre à l’aide de Tailwind CSS.