CCHub Logo CCHub Tailwind Collection
Komponenten Komponenten zur Verbesserung der Navigation Komponente "Navigationsverbesserungskomponenten"

Komponente "Navigationsverbesserungskomponenten"

Eine reaktionsschnelle Navigationskomponente mit Unterstützung des Dunkelmodus für E-Commerce-Websites. Es verfügt über ein triadisches Farbschema mit dunklem Hintergrund, um die Belastung der Augen zu reduzieren.

Vorschau

HTML-Code 

<nav class="bg-gray-900 dark:bg-purple-900 p-4">
  <div class="container mx-auto flex items-center justify-between">
    <a href="#" class="text-white text-lg font-semibold">E-Shop</a>
    <ul class="flex space-x-4">
      <li><a href="#" class="text-gray-300 hover:text-white">Home</a></li>
      <li><a href="#" class="text-gray-300 hover:text-white">Products</a></li>
      <li><a href="#" class="text-gray-300 hover:text-white">Categories</a></li>
      <li><a href="#" class="text-gray-300 hover:text-white">Contact</a></li>
    </ul>
    <div class="flex items-center space-x-4">
      <input type="text" placeholder="Search..." class="bg-gray-800 text-white px-3 py-1 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
      <button class="bg-blue-600 dark:bg-green-600 text-white px-4 py-1 rounded-md">Cart</button>
    </div>
  </div>
</nav>

Verwandte Komponenten

Komponente zur Verbesserung der Navigation

Eine responsive Navigationskomponente, die im Material Design-Stil mit Tailwind CSS entworfen wurde, mit Unterstützung für dunkle Themen und responsiven Effekten.

Offen

Cyberpunk_Portfolio_Navigation

Eine komplexe, reaktionsschnelle Navigationskomponente zum Thema Cyberpunk für ein Portfolio mit futuristischer neonvioletter Ästhetik, dunklen Hintergründen und interaktiven Elementen. Enthält Unterstützung für den Dunkelmodus.

Offen

Komponenten zur Verbesserung der Navigation

Eine reaktionsschnelle Komponente zur Verbesserung der Navigation für einen Blog im Dunkelmodus mit lebendigen Farben und Funktionen zur moderaten Komplexität.

Offen