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.
HTML Code
<nav class="bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 dark:from-gray-800 dark:via-gray-700 dark:to-gray-600 p-4">
<div class="container mx-auto flex items-center justify-between">
<div class="text-white text-2xl font-bold">RetroShop</div>
<div class="hidden md:flex space-x-4">
<a href="#" class="text-white hover:text-gray-200">Home</a>
<a href="#" class="text-white hover:text-gray-200">Products</a>
<a href="#" class="text-white hover:text-gray-200">About</a>
<a href="#" class="text-white hover:text-gray-200">Contact</a>
</div>
<div class="md:hidden">
<button class="text-white">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/>
</svg>
</button>
</div>
</div>
</nav>Composants associés
Composant de navigation dans les médias sociaux
Un composant de navigation réactif conçu pour les interfaces de médias sociaux, avec une esthétique Material Design utilisant un thème sombre avec Tailwind CSS.
Composant de navigation rétro
Un composant de navigation de style rétro avec une esthétique vintage des années 80/90, avec un design réactif et une prise en charge du thème sombre à l’aide de Tailwind CSS.
Composant de navigation
Composant de navigation simple et réactif pour un site web de portfolio, doté d’une interface utilisateur en mode sombre. Le design utilise des couleurs complémentaires et assure la lisibilité et l’attrait esthétique sur différentes tailles d’écran.