CCHub Logo CCHub Tailwind Collection
Komponenten Navigation Navigationskomponente

Navigationskomponente

Eine einfache Navigationskomponente, die für einen Blog mit Mikrointeraktionen und pastellfarbenem Farbschema entwickelt wurde. Es verfügt über ein responsives Layout und Unterstützung für dunkle Themen.

Vorschau

HTML-Code 

<nav class="bg-white dark:bg-gray-800 p-6 rounded-lg shadow-md transition-all duration-300">
    <div class="container mx-auto flex justify-between items-center">
        <div class="flex items-center space-x-4">
            <img src="https://picsum.photos/30/30" alt="Logo" class="rounded-full">
            <span class="text-xl font-semibold text-gray-800 dark:text-white">My Blog</span>
        </div>
        <ul class="flex space-x-6">
            <li>
                <a href="#" class="text-gray-600 dark:text-gray-300 hover:text-gray-800 dark:hover:text-white transition-colors duration-300">Home</a>
            </li>
            <li>
                <a href="#" class="text-gray-600 dark:text-gray-300 hover:text-gray-800 dark:hover:text-white transition-colors duration-300">About</a>
            </li>
            <li>
                <a href="#" class="text-gray-600 dark:text-gray-300 hover:text-gray-800 dark:hover:text-white transition-colors duration-300">Blog</a>
            </li>
            <li>
                <a href="#" class="text-gray-600 dark:text-gray-300 hover:text-gray-800 dark:hover:text-white transition-colors duration-300">Contact</a>
            </li>
        </ul>
    </div>
</nav>

Verwandte Komponenten

Skeuomorphe Navigationskomponente

Eine Navigationskomponente, die in einem skeuomorphen Stil gestaltet ist, mit leuchtenden Farben und einem responsiven Layout, das für Blog-Inhalte geeignet ist. Es enthält interaktive Funktionen wie Hover-Effekte und ist für den Dunkelmodus optimiert.

Offen

3D-Navigationskomponente

Eine reaktionsschnelle 3D-Navigationskomponente für den E-Commerce mit einem Graustufen-Farbschema und Unterstützung für den Dunkelmodus.

Offen

Navigationskomponente

Eine Retro-/Vintage-inspirierte Navigationskomponente, die mit Tailwind CSS entwickelt wurde, mit responsiven Effekten und Unterstützung für dunkle Themen.

Offen