Fondu de pied de page 3D
Pied de page réactif avec éléments de conception 3D et prise en charge du mode sombre
HTML Code
<footer class="bg-gray-100 dark:bg-gray-900 text-gray-800 dark:text-gray-200 py-10">
<div class="container mx-auto px-4">
<div class="flex flex-wrap justify-between items-center">
<div class="w-full md:w-1/3 mb-6 md:mb-0">
<h3 class="text-xl font-bold mb-3">3D Footer</h3>
<p class="text-sm">Explore the depths of our amazing footer. Designed with a touch of 3D for an immersive experience.</p>
</div>
<div class="w-full md:w-1/3 mb-6 md:mb-0">
<h4 class="text-lg font-semibold mb-3">Quick Links</h4>
<ul class="space-y-2">
<li><a href="#" class="hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">Home</a></li>
<li><a href="#" class="hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">Services</a></li>
<li><a href="#" class="hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">About Us</a></li>
<li><a href="#" class="hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">Contact</a></li>
</ul>
</div>
<div class="w-full md:w-1/3">
<h4 class="text-lg font-semibold mb-3">Contact Us</h4>
<p class="text-sm">Email: [email protected]</p>
<p class="text-sm">Phone: +1 234 567 890</p>
<div class="flex mt-4 space-x-4">
<a href="#" class="text-gray-800 dark:text-gray-200 hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">
<i class="fab fa-facebook-f"></i>
</a>
<a href="#" class="text-gray-800 dark:text-gray-200 hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">
<i class="fab fa-twitter"></i>
</a>
<a href="#" class="text-gray-800 dark:text-gray-200 hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">
<i class="fab fa-instagram"></i>
</a>
</div>
</div>
</div>
<div class="mt-8 text-center text-sm">
<p>© 2023 3D Footer. All rights reserved.</p>
</div>
</div>
</footer>Composants associés
Portfolio-Minimaliste-Triadique-Complexe-Footer
Un pied de page complexe de style minimaliste pour un site Web de portfolio, utilisant une palette de couleurs triadique. Comprend des liens de navigation, des icônes de médias sociaux, des droits d’auteur et un appel à l’action pour le contact, avec une réactivité totale et une prise en charge du mode sombre.
Composant de pied de page
Un composant de pied de page de style Brutalism avec des effets réactifs et une prise en charge du thème sombre à l’aide de Tailwind CSS.
3D analogue simple pied de blog
Composant de pied de page réactif avec prise en charge du thème sombre à l’aide de Tailwind CSS. Le pied de page a un design 3D simple avec des couleurs analogues. Il est optimisé pour les sites de blog/contenu.