Composants Navigation par fil d’Ariane Composant de navigation du fil d’Ariane

Composant de navigation du fil d’Ariane

Un composant de navigation de fil d’Ariane réactif conçu avec le style Glassmorphism et les couleurs de ton Terre, parfait pour les sites Web d’entreprise professionnels. Il prend en charge le thème sombre et comprend des fonctionnalités interactives pour la navigation.

Aperçu

HTML Code

<nav class="bg-opacity-50 backdrop-blur-lg bg-white dark:bg-gray-800 rounded-lg p-4 shadow-lg">
    <ol class="list-reset flex items-center space-x-4 text-gray-600 dark:text-gray-300">
        <li>
            <a href="#" class="text-green-600 dark:text-green-400 hover:text-green-800 dark:hover:text-green-200">Home</a>
        </li>
        <li>
            <span class="text-gray-400 dark:text-gray-500">/</span>
        </li>
        <li>
            <a href="#" class="text-green-600 dark:text-green-400 hover:text-green-800 dark:hover:text-green-200">Services</a>
        </li>
        <li>
            <span class="text-gray-400 dark:text-gray-500">/</span>
        </li>
        <li>
            <a href="#" class="text-green-600 dark:text-green-400 hover:text-green-800 dark:hover:text-green-200">Consulting</a>
        </li>
    </ol>
</nav>

<!-- Example of how to display user avatars or images in a Breadcrumb if needed -->
<div class="flex items-center space-x-3 mt-4">
    <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="User Avatar" class="w-10 h-10 rounded-full border-2 border-white dark:border-gray-800">
    <span class="text-gray-600 dark:text-gray-300">John Doe</span>
</div>

Composants associés

Composant de navigation du fil d’Ariane

Composant de navigation réactif avec Material Design et Tailwind CSS, avec prise en charge du thème sombre et une palette de couleurs triadique.

Ouvrir

Neon_Glow_Gaming_Breadcrumb

Un composant de navigation complexe et réactif conçu pour les sites Web de jeux, avec des effets de néon/lueur avec une base en noir et blanc et une couleur d’accentuation vibrante. Inclut la prise en charge du mode sombre et du HTML sémantique.

Ouvrir

Composant de navigation du fil d’Ariane

Un composant de navigation réactif conçu dans le style Neumorphism, prenant en charge le mode sombre, créé à l’aide de Tailwind CSS.

Ouvrir