CCHub Logo CCHub Tailwind Collection
Komponenten Fußzeilen-Navigation Komponente "Fußzeilennavigation"

Komponente "Fußzeilennavigation"

Eine reaktionsschnelle Fußzeilennavigationskomponente, die für Geschäfts-/Unternehmenswebsites im Dunkelmodus entwickelt wurde, mit einem triadischen Farbschema und mittlerer Komplexität mit interaktiven Funktionen.

Vorschau

HTML-Code 

<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">&copy; 2023 Company Name. All rights reserved.</p>
    </div>
</footer>

Verwandte Komponenten

3D-Design-Fußzeilennavigationskomponente

Eine Fußzeilennavigationskomponente im 3D-Stil mit responsivem Design und Unterstützung für den Dunkelmodus.

Offen

Komponente "Fußzeilennavigation"

Eine reaktionsschnelle Fußzeilennavigationskomponente, die für ein Dashboard entwickelt wurde und einen Skeuomorphen Stil mit leuchtenden Farben aufweist. Es enthält Navigationslinks, ein Logo und Social-Media-Symbole mit vollständiger Unterstützung des Dunkelmodus mit Tailwind CSS. Das Design zielt auf eine moderate Komplexität mit interaktiven Hover-Effekten ab.

Offen

Glassmorphism Graustufen Gesundheitswesen Fußzeile

Eine reaktionsschnelle Fußzeilennavigationskomponente im Glassmorphism-Stil für Anwendungen im Gesundheitswesen/Medizin, die ein Graustufen-Farbschema mit Unterstützung für den Dunkelmodus verwendet. Es verfügt über glasfaserähnliche, durchscheinende Elemente und interaktive Links.

Offen