Componentes Navegación Componente de navegación

Componente de navegación

Un componente de navegación de modo oscuro receptivo diseñado para el comercio electrónico con una combinación de colores pastel y un diseño simple.

Vista previa

Código HTML

<nav class="bg-gray-800 dark:bg-gray-900 p-4">
    <div class="container mx-auto flex items-center justify-between">
        <div class="flex items-center space-x-4">
            <a href="#" class="text-pink-300 hover:text-pink-400 dark:text-pink-200 dark:hover:text-pink-300">Home</a>
            <a href="#" class="text-pink-300 hover:text-pink-400 dark:text-pink-200 dark:hover:text-pink-300">Shop</a>
            <a href="#" class="text-pink-300 hover:text-pink-400 dark:text-pink-200 dark:hover:text-pink-300">About Us</a>
            <a href="#" class="text-pink-300 hover:text-pink-400 dark:text-pink-200 dark:hover:text-pink-300">Contact</a>
        </div>
        <div class="flex items-center space-x-4">
            <a href="#" class="text-pink-300 hover:text-pink-400 dark:text-pink-200 dark:hover:text-pink-300">
                <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar">
            </a>
            <a href="#" class="text-pink-300 hover:text-pink-400 dark:text-pink-200 dark:hover:text-pink-300">Cart</a>
        </div>
    </div>
</nav>

Componentes relacionados

Componente de navegación

Un componente de navegación simple diseñado para un blog con microinteracciones y combinación de colores pastel. Cuenta con un diseño responsivo y soporte para temas oscuros.

Abrir

Componente de navegación responsivo

Componente de navegación receptivo con microinteracciones, combinación de colores en escala de grises y complejidad simple.

Abrir

Componente de navegación de redes sociales

Un componente de navegación responsivo diseñado para interfaces de redes sociales, con una estética de Material Design que utiliza un tema oscuro con Tailwind CSS.

Abrir