Componente Mega Menú
Un Mega Componente de Menú receptivo diseñado en un estilo esqueuomórfico con un esquema de color en escala de grises para sitios web comerciales y corporativos. Es compatible con el tema oscuro y utiliza Tailwind CSS para el estilo.
Código HTML
<div class="bg-gray-100 dark:bg-gray-900 p-5 rounded-lg shadow-lg">
<h2 class="text-xl font-bold text-gray-800 dark:text-gray-200">Services</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mt-4">
<div class="bg-white dark:bg-gray-800 p-4 rounded-md shadow">
<img src="https://picsum.photos/200/150?random=1" alt="Service 1" class="w-full h-32 object-cover rounded-md mb-2">
<h3 class="text-lg font-semibold text-gray-700 dark:text-gray-300">Consulting</h3>
<p class="text-gray-600 dark:text-gray-400">Professional consulting services to help you grow.</p>
</div>
<div class="bg-white dark:bg-gray-800 p-4 rounded-md shadow">
<img src="https://picsum.photos/200/150?random=2" alt="Service 2" class="w-full h-32 object-cover rounded-md mb-2">
<h3 class="text-lg font-semibold text-gray-700 dark:text-gray-300">Marketing</h3>
<p class="text-gray-600 dark:text-gray-400">Effective marketing strategies tailored to your needs.</p>
</div>
<div class="bg-white dark:bg-gray-800 p-4 rounded-md shadow">
<img src="https://picsum.photos/200/150?random=3" alt="Service 3" class="w-full h-32 object-cover rounded-md mb-2">
<h3 class="text-lg font-semibold text-gray-700 dark:text-gray-300">Support</h3>
<p class="text-gray-600 dark:text-gray-400">24/7 support to assist with your queries.</p>
</div>
</div>
<h2 class="text-xl font-bold text-gray-800 dark:text-gray-200 mt-8">About Us</h2>
<div class="flex items-center mt-4">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar" class="w-12 h-12 rounded-full mr-4">
<p class="text-gray-600 dark:text-gray-400">Our team is dedicated to providing exceptional service and value.</p>
</div>
</div>Componentes relacionados
Brutalist_Triadic_Simple_Mega_Menu
Un mega menú simple de estilo brutalista diseñado para un blog o sitio de contenido, con un esquema de color triádico y una capacidad de respuesta completa con soporte para modo oscuro.
Mega Componente de Menú - Comercio Electrónico Vibrante Neumorphic
Un mega componente de menú complejo y receptivo diseñado con un estilo de comercio electrónico vibrante y neumórfico. Cuenta con múltiples columnas, ejemplos de imágenes y listados de categorías, con soporte completo para el modo oscuro.
Componente Mega Menú
Mega Componente de Menú con estilo Neumorfismo para el sitio web de Blog/Contenido, utilizando un esquema de color análogo y una complejidad moderada. Diseño responsivo con soporte para temas oscuros. Sin JavaScript.