Navigation rétro E-commerce
Composant de navigation réactif avec un design rétro/vintage, des tons de terre et la prise en charge du mode sombre pour le commerce électronique.
HTML Code
<nav class="bg-amber-100 dark:bg-amber-950 p-4 font-serif">
<div class="container mx-auto flex justify-between items-center">
<a href="#" class="text-amber-800 dark:text-amber-200 text-2xl font-bold">RetroStore</a>
<div class="hidden md:flex space-x-6">
<a href="#" class="text-amber-700 dark:text-amber-300 hover:text-amber-900 dark:hover:text-amber-100 transition duration-300">Shop</a>
<a href="#" class="text-amber-700 dark:text-amber-300 hover:text-amber-900 dark:hover:text-amber-100 transition duration-300">Categories</a>
<a href="#" class="text-amber-700 dark:text-amber-300 hover:text-amber-900 dark:hover:text-amber-100 transition duration-300">Contact</a>
<a href="#" class="text-amber-700 dark:text-amber-300 hover:text-amber-900 dark:hover:text-amber-100 transition duration-300">Cart</a>
</div>
<div class="md:hidden flex items-center">
<button class="text-amber-700 dark:text-amber-300 focus:outline-none">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
</svg>
</button>
</div>
</div>
</nav>Composants associés
RétroNav
Un composant de navigation simple, réactif et compatible avec le mode sombre avec un design rétro/vintage, une palette de couleurs vives et des éléments minimaux, adapté aux sites Web de commerce électronique.
Composante de navigation brutaliste du commerce électronique
Un composant de navigation e-commerce complexe et brutaliste utilisant Tailwind CSS, avec un schéma de couleurs triadique (jaune, cyan, fuchsia) avec un contraste élevé (noir/blanc), un méga-menu CSS uniquement, une révélation de recherche CSS uniquement, un menu mobile réactif CSS uniquement et la prise en charge du mode sombre. HTML uniquement, pas de JavaScript.
Navigation Monospace pour le secteur de la santé
Il s’agit d’un composant de navigation complexe et réactif pour les applications médicales/de santé, doté d’un design inspiré du monospace/développeur avec des neutres chauds, la prise en charge du mode sombre et des éléments interactifs.