Навигация по приборной панели (Material Design)
Компонент навигации приборной панели Material Design с триадической цветовой схемой и поддержкой темного режима.
HTML-код
<nav class="bg-white dark:bg-gray-800 shadow">
<div class="container mx-auto px-6 py-3">
<div class="flex items-center justify-between">
<div class="text-gray-800 dark:text-white font-bold text-xl">Dashboard</div>
<div class="flex space-x-4">
<a href="#" class="text-gray-800 dark:text-white hover:text-blue-500 dark:hover:text-blue-400 transition duration-300">Home</a>
<a href="#" class="text-gray-800 dark:text-white hover:text-teal-500 dark:hover:text-teal-400 transition duration-300">Analytics</a>
<a href="#" class="text-gray-800 dark:text-white hover:text-red-500 dark:hover:text-red-400 transition duration-300">Settings</a>
</div>
</div>
</div>
</nav>Связанные компоненты
Компонент 3D-навигации
Адаптивный компонент 3D-навигации, разработанный для электронной коммерции, с цветовой схемой в оттенках серого и поддержкой темного режима.
Бруталистский компонент навигации по электронной коммерции
Сложный и брутальный компонент навигации по электронной коммерции с использованием Tailwind CSS, включающий триадическую цветовую схему (желтый, голубой, фуксия) с высокой контрастностью (черный/белый), мега-меню только CSS, отображение поиска только CSS, адаптивное мобильное меню только CSS и поддержку темного режима. Только HTML, без JavaScript.
Компонент скевоморфной навигации
Скевоморфный компонент навигации, разработанный для имитации реальных элементов, таких как физическая панель управления или приборная панель. Отличается адаптивным дизайном, эффектами наведения, имитирующими нажатие физических кнопок, и поддержкой темных тем. Навигация включает в себя тонкие тени, градиенты и текстуры для создания 3D-тактильного вида, напоминающего физические интерфейсы.