Componente Mappe retrò
Un componente Mappe semplice, reattivo e compatibile con la modalità oscura con un'estetica retrò/vintage, una combinazione di colori vivaci e uno scopo aziendale/aziendale, costruito con Tailwind CSS.
Codice HTML
<section class="bg-gray-100 dark:bg-gray-900 py-12">
<div class="container mx-auto px-4">
<h2 class="text-3xl font-bold text-center text-gray-800 dark:text-white mb-8">Our Location</h2>
<div class="relative">
<img src="https://picsum.photos/seed/maps/800/400" alt="Map of our location" class="w-full h-96 object-cover rounded-lg shadow-lg">
<div class="absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-50 rounded-lg"></div>
<div class="absolute bottom-0 left-0 right-0 p-6 text-white">
<h3 class="text-2xl font-semibold mb-2">Find Us Here</h3>
<p class="text-gray-300">123 Main Street, Anytown, USA</p>
</div>
</div>
</div>
</section>Componenti correlati
Componente Mappe
Un componente di mappe complesso progettato in stile Material Design, adatto per dashboard. Integra elementi reattivi, funzionalità interattive e supporta l'estetica della modalità oscura utilizzando una combinazione di colori analoga.
Componente Mappe
Componente Mappe reattive con supporto per la modalità oscura utilizzando Tailwind CSS.
Componente Mappe
Componente Mappe con design Skeuomorphism, combinazione di colori triadica, complessità moderata e scopo per i social media. Design reattivo con supporto per temi scuri utilizzando Tailwind CSS.