Composant de navigation en pied de page
Un composant de navigation en pied de page réactif avec un style de design rétro/vintage, utilisant des couleurs vives et adapté aux interfaces de médias sociaux.
HTML Code
<footer class="bg-gradient-to-b from-purple-500 to-pink-600 dark:from-purple-900 dark:to-pink-800 py-8">
<div class="container mx-auto px-4">
<div class="flex flex-col md:flex-row justify-between items-center">
<div class="text-white text-center mb-4 md:mb-0">
<h2 class="text-2xl font-bold">Stay Connected</h2>
<p class="text-sm">Follow us on our social channels</p>
</div>
<div class="flex space-x-4">
<a href="https://facebook.com" class="text-white hover:underline">
<img src="https://picsum.photos/30/30?random=1" alt="Facebook" class="inline-block">
</a>
<a href="https://twitter.com" class="text-white hover:underline">
<img src="https://picsum.photos/30/30?random=2" alt="Twitter" class="inline-block">
</a>
<a href="https://instagram.com" class="text-white hover:underline">
<img src="https://picsum.photos/30/30?random=3" alt="Instagram" class="inline-block">
</a>
<a href="https://linkedin.com" class="text-white hover:underline">
<img src="https://picsum.photos/30/30?random=4" alt="LinkedIn" class="inline-block">
</a>
</div>
</div>
</div>
<div class="text-center text-white text-sm mt-4">
<p>© 2023 Your Company. All rights reserved.</p>
</div>
</footer>
Composants associés
Composant de navigation en pied de page
Composant de navigation de pied de page inspiré de l’agriculture et de la nature pour une place de marché, avec des lignes fluides, une palette de couleurs analogues, plusieurs sections et un design réactif avec prise en charge du mode sombre.
Composant de navigation de pied de page de conception 3D
Un composant de navigation de pied de page de style 3D avec un design réactif et une prise en charge du mode sombre.
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 :.