CCHub Logo CCHub Tailwind Collection
Komponenten Fußzeile Footer-Komponente

Footer-Komponente

Eine minimalistische Fußzeilenkomponente mit Komplementärfarben, moderater Komplexität und Social-Media-Integration. Verfügt über responsives Design und Unterstützung für den Dunkelmodus.

Vorschau

HTML-Code 

<footer class="bg-gray-100 dark:bg-gray-900 py-8">
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
    <div class="flex flex-wrap justify-between items-center">
      <div class="w-full md:w-1/3 text-center md:text-left mb-4 md:mb-0">
        <p class="text-gray-600 dark:text-gray-400 text-sm">&copy; 2023 SocialApp. All rights reserved.</p>
      </div>
      <div class="w-full md:w-1/3 flex justify-center mb-4 md:mb-0">
        <ul class="flex space-x-6">
          <li><a href="#" class="text-blue-600 dark:text-orange-400 hover:text-blue-800 dark:hover:text-orange-500 text-sm">Privacy Policy</a></li>
          <li><a href="#" class="text-blue-600 dark:text-orange-400 hover:text-blue-800 dark:hover:text-orange-500 text-sm">Terms of Service</a></li>
        </ul>
      </div>
      <div class="w-full md:w-1/3 flex justify-center md:justify-end">
        <ul class="flex space-x-4">
          <li><a href="#" class="text-blue-600 dark:text-orange-400 hover:text-blue-800 dark:hover:text-orange-500"><i class="fab fa-facebook-f"></i></a></li>
          <li><a href="#" class="text-blue-600 dark:text-orange-400 hover:text-blue-800 dark:hover:text-orange-500"><i class="fab fa-twitter"></i></a></li>
          <li><a href="#" class="text-blue-600 dark:text-orange-400 hover:text-blue-800 dark:hover:text-orange-500"><i class="fab fa-instagram"></i></a></li>
          <li><a href="#" class="text-blue-600 dark:text-orange-400 hover:text-blue-800 dark:hover:text-orange-500"><i class="fab fa-linkedin-in"></i></a></li>
        </ul>
      </div>
    </div>
  </div>
</footer>

Verwandte Komponenten

Footer-Komponente

Eine Fußzeilenkomponente im Brutalismus-Stil mit responsiven Effekten und Unterstützung für dunkle Themen unter Verwendung von Tailwind CSS.

Offen

Minimalistische Social-Media-Fußzeile

Eine minimalistische Fußzeilenkomponente mit Erdtönen für Social-Media-Schnittstellen. Reaktionsschnell mit Unterstützung für dunkle Themen.

Offen

Luxury_Pastel_Government_Footer

Eine elegante, reaktionsschnelle Fußzeilenkomponente für Websites von Behörden oder öffentlichen Diensten mit einem luxuriösen Design mit pastellfarbenem Farbschema und Unterstützung für den Dunkelmodus. Enthält Navigationslinks, Kontaktinformationen, soziale Medien und Urheberrecht.

Offen