Composant de navigation en pied de page
Un composant de navigation de pied de page réactif avec un style glassmorphism avec des éléments translucides givrés ressemblant à du verre et des effets de flou. Il prend en charge le mode sombre et inclut des images de repère d’emplacement.
HTML Code
<footer class="bg-white bg-opacity-30 backdrop-blur-lg dark:bg-gray-900 dark:bg-opacity-30 py-8">
<div class="container mx-auto px-4">
<div class="flex flex-col md:flex-row justify-between items-center">
<div class="flex items-center space-x-4">
<img src="https://picsum.photos/40/40" alt="Avatar" class="rounded-full">
<span class="text-lg font-bold text-gray-800 dark:text-gray-200">Your Company</span>
</div>
<nav class="flex flex-col md:flex-row space-y-2 md:space-y-0 md:space-x-6 mt-4 md:mt-0">
<a href="#" class="text-gray-600 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition">Home</a>
<a href="#" class="text-gray-600 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition">About</a>
<a href="#" class="text-gray-600 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition">Services</a>
<a href="#" class="text-gray-600 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition">Contact</a>
</nav>
</div>
<div class="mt-6 text-center">
<p class="text-gray-500 dark:text-gray-400">© 2023 Your Company. All rights reserved.</p>
</div>
</div>
</footer>Composants associés
Glassmorphism Footer Navigation
Composant de navigation en pied de page avec style Glassmorphism, palette de couleurs vives et mise en page complexe à des fins de tableau de bord. Conception réactive avec prise en charge du mode sombre à l’aide de Tailwind CSS.
Retro_Earth_Tone_Portfolio_Footer
Un composant de navigation de pied de page réactif à thème rétro pour un site Web de portfolio, avec la prise en charge des tons de terre et du mode sombre. Conçu avec l’esthétique des années 80/90 à l’esprit, offrant une sensation nostalgique.
Composant de navigation en pied de page
Un composant de navigation de pied de page réactif avec un thème sombre, adapté à un site web de portfolio. Il présente une palette de couleurs monochromatique avec différentes nuances d’une seule couleur, une complexité moyenne avec quelques fonctionnalités interactives, et utilise Tailwind CSS pour le style, y compris la prise en charge du mode sombre avec le préfixe dark :.