Retour en haut de la page Composant du bouton
Un composant de bouton Back to Top minimaliste et plat pour les tableaux de bord, avec une palette de couleurs monochromatiques. Il est modérément complexe avec des fonctionnalités interactives, un design réactif et une prise en charge du thème sombre, construit uniquement avec HTML et Tailwind CSS.
HTML Code
<div class="fixed bottom-4 right-4">
<a href="#" class="bg-gray-300 dark:bg-gray-700 text-gray-800 dark:text-gray-200 p-3 rounded-full shadow-md hover:bg-gray-400 dark:hover:bg-gray-600 transition-colors duration-300 ease-in-out flex items-center justify-center">
<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="M5 10l7-7m0 0l7 7m-7-7v18" />
</svg>
</a>
</div>Composants associés
Retour en haut de la page Composant du bouton
Un composant de bouton de retour en haut réactif avec un design Glassmorphism, une palette de couleurs de tons de terre et des interactions complexes, adapté à un tableau de bord.
Retour en haut Bouton Minimaliste Vibrant
Un composant de bouton Retour en haut minimal et plat avec des couleurs vives, 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.
Retour en haut du bouton
Un bouton simple et élégant de retour en haut qui apparaît fixe dans le coin inférieur droit de l’écran. Dispose d’une palette de couleurs pastel subtile et de micro-interactions fluides. Le bouton comprend un design réactif avec prise en charge intégrée du mode sombre. Lorsqu’il est survolé, le bouton s’agrandit doucement et change de couleur d’arrière-plan pour fournir un retour visuel. Le composant utilise uniquement les classes CSS Tailwind, sans JavaScript requis.