Componenti Mega Menù Componente Mega Menu

Componente Mega Menu

Un componente Mega Menu reattivo progettato in uno stile scheumorfico con una combinazione di colori in scala di grigi per siti Web aziendali e aziendali. Supporta il tema scuro e utilizza Tailwind CSS per lo stile.

Anteprima

Codice 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>

Componenti correlati

Componente Mega Menu

Un mega menu reattivo complesso ispirato al 3D per una dashboard. Utilizza una combinazione di colori triadica, supporta la modalità oscura e presenta più sezioni interattive per la visualizzazione dei dati e i pannelli di controllo.

Aperto

Componente Mega Menu

Un componente Mega Menu reattivo progettato con lo stile Glassmorphism, con elementi traslucidi simili al vetro smerigliato con effetti di sfocatura, che supportano temi scuri utilizzando Tailwind CSS.

Aperto

Componente Mega Menu

Un componente Mega Menu in stile neumorfico per un sito portfolio, progettato con una combinazione di colori in scala di grigi e supporto per temi scuri reattivi utilizzando Tailwind CSS.

Aperto