Componente di navigazione del piè di pagina
Un componente di navigazione a piè di pagina reattivo progettato per siti Web aziendali/aziendali in modalità scura, caratterizzato da una combinazione di colori triadica e complessità media con funzionalità interattive.
Codice HTML
<footer class="bg-gray-800 text-gray-200 py-6">
<div class="container mx-auto flex justify-between items-center flex-wrap">
<div class="flex flex-col w-full md:w-1/3 mb-4">
<h4 class="font-bold text-lg">Company Info</h4>
<p class="text-sm">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, voluptatum.</p>
</div>
<div class="flex flex-col w-full md:w-1/3 mb-4">
<h4 class="font-bold text-lg">Quick Links</h4>
<ul>
<li><a href="#" class="text-gray-400 hover:text-gray-100 transition">Home</a></li>
<li><a href="#" class="text-gray-400 hover:text-gray-100 transition">About Us</a></li>
<li><a href="#" class="text-gray-400 hover:text-gray-100 transition">Services</a></li>
<li><a href="#" class="text-gray-400 hover:text-gray-100 transition">Contact</a></li>
</ul>
</div>
<div class="flex flex-col w-full md:w-1/3 mb-4">
<h4 class="font-bold text-lg">Contact Us</h4>
<div class="flex items-center mb-2">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar" class="w-10 h-10 rounded-full mr-2">
<div class="text-sm">
<p>John Doe</p>
<p>[email protected]</p>
</div>
</div>
<p class="text-sm">Reach out to us for any inquiries.</p>
</div>
</div>
<div class="bg-gray-700 text-center py-4 mt-4">
<p class="text-sm">© 2023 Company Name. All rights reserved.</p>
</div>
</footer>Componenti correlati
Brutalismo E-commerce Footer Navigation
Un componente di navigazione a piè di pagina semplice e brutale per l'e-commerce, con colori pastello e supporto per la modalità scura.
Componente di navigazione del piè di pagina
Un componente di navigazione a piè di pagina reattivo progettato con uno stile scheumorfico, con elementi interattivi adatti all'e-commerce. Segue una combinazione di colori triadici e supporta la modalità scura.
Componente di navigazione del piè di pagina
Un semplice componente di navigazione a piè di pagina progettato in stile Glassmorphism con una combinazione di colori monocromatica. È reattivo, supporta la modalità oscura ed è adatto per i siti di e-commerce.