Retour en haut de la page Composant du bouton
Un composant de bouton « Retour en haut » réactif conçu pour le commerce électronique, avec une palette de couleurs vives sur un fond sombre. Il comprend un effet de survol subtil et assure une visibilité sur toutes les tailles d’écran avec la prise en charge du mode sombre.
HTML Code
<div class="fixed bottom-4 right-4 z-50">
<a href="#top" class="group block p-3 rounded-full bg-gradient-to-br from-purple-600 to-indigo-500 shadow-lg transition-all duration-300 ease-in-out hover:from-purple-700 hover:to-indigo-600 focus:outline-none focus:ring-4 focus:ring-purple-300 dark:focus:ring-purple-800">
<svg class="w-6 h-6 text-white transform transition-transform duration-300 ease-in-out group-hover:-translate-y-1" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 10l7-7m0 0l7 7m-7-7v18"></path>
</svg>
<span class="sr-only">Back to Top</span>
</a>
</div>
Composants associés
Retour en haut de la page Composant du bouton
Un bouton réactif « Retour en haut » avec un design artistique à l’aquarelle, une palette de couleurs d’automne et une prise en charge du mode sombre, adapté aux sites de blog/contenu.
Art Déco Retour en haut Bouton
Un composant de bouton complexe, inspiré de l’Art déco, avec des motifs géométriques et des tons luxueux Ocean/Blue, conçu pour les sites Web à but non lucratif / caritatifs. Comprend la conception réactive et la prise en charge du mode sombre.
Retour en haut de la page Composant du bouton
Un bouton « Retour en haut » réactif qui suit les principes de conception matérielle, prenant en charge le mode sombre avec Tailwind CSS pour le style et les effets réactifs.