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.
HTML Code
<footer class="bg-gray-800 text-white p-10 flex flex-col items-center justify-center"> <div class="flex flex-wrap justify-center"> <div class="m-5"> <h4 class="text-2xl font-bold mb-2">Contact Us</h4> <p class="text-lg">Email: [email protected]</p> <p class="text-lg">Phone: (123) 456-7890</p> </div> <div class="m-5"> <h4 class="text-2xl font-bold mb-2">Follow Us</h4> <div class="flex space-x-4"> <a href="#" class="text-lg hover:text-gray-400">Facebook</a> <a href="#" class="text-lg hover:text-gray-400">Twitter</a> <a href="#" class="text-lg hover:text-gray-400">Instagram</a> </div> </div> <div class="m-5"> <h4 class="text-2xl font-bold mb-2">About Us</h4> <p class="text-lg">We are a company that values...</p> </div> </div> <div class="flex flex-wrap justify-center mt-10"> <img class="rounded-full h-16 w-16 m-2" src="https://randomuser.me/api/portraits/men/32.jpg" alt="Avatar 1"> <img class="rounded-full h-16 w-16 m-2" src="https://randomuser.me/api/portraits/women/32.jpg" alt="Avatar 2"> <img class="rounded-full h-16 w-16 m-2" src="https://randomuser.me/api/portraits/men/34.jpg" alt="Avatar 3"> </div> <div class="mt-10 text-center"> <p class="text-sm">© 2023 Example Company. All Rights Reserved.</p> </div> <style> @media (prefers-color-scheme: dark) { .bg-gray-800 { background-color: #1a1a1a; } .text-white { color: #f0f0f0; } .hover\:text-gray-400:hover { color: #a0a0a0; } } </style> </footer>Composants associés
Organic_Nature_Inspired_Real_Estate_Footer
Un composant de pied de page complexe, inspiré de la nature et de couleur complémentaire pour les plateformes immobilières, avec des lignes fluides, des formes naturelles, de multiples éléments interactifs et une réactivité totale avec la prise en charge du mode sombre.
Composant de pied de page skeuomorphe
Composant de pied de page réactif avec un design skeuomorphe, une palette de couleurs analogue (verts, bleus-verts) et une complexité modérée adaptée aux sites Web d’entreprise. Comprend des liens, un espace réservé pour le logo et un effet Skeuomorphic subtil obtenu avec des ombres et des dégradés. Prend en charge les modes clair et sombre.
Corporate_Industrial_Footer_Ocean_Blue
Un composant de pied de page réactif, sur le thème de l’entreprise et de l’industrie, avec une palette de couleurs océan/bleu, conçu pour les entreprises manufacturières. Comprend des liens de navigation, des informations de contact, des médias sociaux et des droits d’auteur, avec une prise en charge complète du mode sombre.