Components Footer Glassmorphism Monochromatic Footer

Glassmorphism Monochromatic Footer

A simple, monochromatic glassmorphism footer component for a blog, with responsive design and dark mode support.

Preview

HTML Code


<footer class="backdrop-blur-md bg-white/30 dark:bg-gray-800/30 text-gray-800 dark:text-gray-200 p-6">
  <div class="container mx-auto flex flex-col items-center justify-between md:flex-row">
    <div class="mb-4 md:mb-0 text-center md:text-left">
      <p>&copy; 2023 Blog Name. All rights reserved.</p>
    </div>
    <div class="flex space-x-4">
      <a href="#" class="hover:text-gray-600 dark:hover:text-gray-400 transition-colors duration-200">Privacy Policy</a>
      <a href="#" class="hover:text-gray-600 dark:hover:text-gray-400 transition-colors duration-200">Terms of Service</a>
      <a href="#" class="hover:text-gray-600 dark:hover:text-gray-400 transition-colors duration-200">Contact</a>
    </div>
  </div>
</footer>

Related Components

Neumorphism Earth Footer

Responsive Footer Component with Neumorphism, Earth tones, and Dark theme support

Open

3D Footer Fade-in

Responsive Footer with 3D Design elements and Dark Mode support

Open

Footer Component Footer

A simple footer component with a subtle Skeuomorphism design, using an analogous color scheme. It includes a copyright notice, a few navigation links, and social media icons. The design is responsive and supports dark mode.

Open