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

Footer-Komponente

Eine einfache, reaktionsschnelle Fußzeilenkomponente im Retro-/Vintage-Stil mit Unterstützung für dunkle Themen unter Verwendung von Tailwind CSS. Es verfügt über ein grundlegendes Layout, das für Geschäfts-/Unternehmenswebsites geeignet ist.

Vorschau

HTML-Code 

<footer class="bg-blue-900 text-white py-6 mt-10 dark:bg-gray-800">
    <div class="container mx-auto text-center">
        <div class="flex flex-col md:flex-row justify-between items-center">
            <div class="mb-4 md:mb-0">
                <img src="https://picsum.photos/100/50" alt="Company Logo" class="mx-auto mb-2">
                <h2 class="text-lg font-bold">Company Name</h2>
                <p class="text-sm">Your tagline goes here.</p>
            </div>
            <div>
                <h3 class="text-md font-semibold mb-2">Follow Us</h3>
                <div class="flex justify-center space-x-4">
                    <a href="#" class="text-gray-400 hover:text-gray-200"><img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Facebook" class="h-6 w-6"></a>
                    <a href="#" class="text-gray-400 hover:text-gray-200"><img src="https://randomuser.me/api/portraits/men/2.jpg" alt="Twitter" class="h-6 w-6"></a>
                    <a href="#" class="text-gray-400 hover:text-gray-200"><img src="https://randomuser.me/api/portraits/women/1.jpg" alt="Instagram" class="h-6 w-6"></a>
                </div>
            </div>
        </div>
        <div class="mt-6 border-t border-gray-600 pt-4">
            <p class="text-xs">&copy; 2023 Company Name. All rights reserved.</p>
        </div>
    </div>
</footer>

Verwandte Komponenten

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

Social-Media-Fußzeilenkomponente

Eine responsive Fußzeilenkomponente für Schnittstellen in sozialen Netzwerken, die nach den Prinzipien des Material Designs unter Verwendung eines monochromatischen blauen Farbschemas entwickelt wurde. Es bietet rasterbasierte Layouts, Tiefeneffekte (Schatten), Hover- und Übergangsanimationen für interaktive Elemente, ein Newsletter-Anmeldeformular, soziale Symbole, Benutzer-Avatare und Unterstützung des Dunkelmodus über den Dark:-Modifikator von Tailwind.

Offen

Industrial_Charity_Footer

Eine komplexe, reaktionsschnelle Fußzeilenkomponente für gemeinnützige/wohltätige Websites, die sich durch eine industrielle und rohe Ästhetik mit einer Retro-/Vintage-Farbpalette auszeichnet. Enthält Navigation, Kontaktinformationen, soziale Links und eine Newsletter-Anmeldung mit vollständiger Unterstützung des Dunkelmodus.

Offen