Composant de navigation du fil d’Ariane
Un composant de navigation Breadcrumb réactif conçu avec le style Neumorphism à l’aide de Tailwind CSS, avec prise en charge du thème sombre.
HTML Code
<nav class="bg-white dark:bg-gray-800 rounded-xl shadow-md p-4 mb-6 max-w-4xl mx-auto">
<ol class="list-reset flex text-gray-700 dark:text-gray-300">
<li>
<a href="#" class="text-blue-500 hover:text-blue-700">Home</a>
</li>
<li>
<span class="mx-2">/</span>
</li>
<li>
<a href="#" class="text-blue-500 hover:text-blue-700">Library</a>
</li>
<li>
<span class="mx-2">/</span>
</li>
<li>
<a href="#" class="text-blue-500 hover:text-blue-700">Data</a>
</li>
</ol>
</nav>
<style>
/* Neumorphism styles */
nav {
box-shadow: 8px 8px 15px rgba(0, 0, 0, 0.1),
-8px -8px 15px rgba(255, 255, 255, 0.7);
}
nav.dark {
box-shadow: 8px 8px 15px rgba(0, 0, 0, 0.5),
-8px -8px 15px rgba(0, 0, 0, 0.2);
}
</style>
Composants associés
Composant de navigation du fil d’Ariane
Un composant de navigation Breadcrumb réactif utilisant le style de conception Neumorphism avec une palette de couleurs pastel et la prise en charge du thème sombre, construit à l’aide de Tailwind CSS.
Memphis_Rainbow_Breadcrumb_Navigation
Un composant de navigation simple et réactif avec une esthétique audacieuse de Memphis Design avec un dégradé arc-en-ciel multicolore, adapté aux sites de blogs/de contenu. Inclut la prise en charge du mode sombre.
Glassmorphism Fil d’Ariane
Navigation réactive par fil d’Ariane Glassmorphism avec mode sombre.