Footer Navigation Component
A simple footer navigation component styled with Material Design principles and an analogous color scheme for business/corporate websites. It supports dark mode and is responsive.
HTML Code
<footer class="bg-gray-100 dark:bg-gray-800 py-6">
<div class="container mx-auto px-4">
<div class="flex flex-col md:flex-row justify-between items-center">
<div class="mb-4 md:mb-0">
<img src="https://picsum.photos/200/50" alt="Company Logo" class="h-10" />
</div>
<div class="flex flex-col md:flex-row space-x-4">
<a href="#" class="text-gray-800 dark:text-gray-300 hover:underline">About Us</a>
<a href="#" class="text-gray-800 dark:text-gray-300 hover:underline">Services</a>
<a href="#" class="text-gray-800 dark:text-gray-300 hover:underline">Contact</a>
<a href="#" class="text-gray-800 dark:text-gray-300 hover:underline">Privacy Policy</a>
</div>
</div>
<div class="mt-6 text-center">
<p class="text-gray-600 dark:text-gray-400 text-sm">© 2023 Company Name. All rights reserved.</p>
</div>
</div>
</footer>
Related Components
Watercolor Artistic Footer Navigation Component
A complex, responsive footer navigation component designed for non-profit/charity websites, featuring a watercolor artistic style with soft, sepia/brown tones and dark mode support. Includes multiple navigation links, social media icons, and a copyright section.
Retro/Vintage E-commerce Footer
Retro/Vintage Footer Navigation Component with Earth tones, simple layout, responsive design, and dark theme support, for E-commerce.
Footer Navigation Component - Monospace/Developer Style
A complex, responsive footer navigation component designed for agriculture/farming websites, featuring a monospace/developer aesthetic with a gradient rainbow color scheme and dark mode support.