Maps-Komponente
Eine responsive Kartenkomponente, die mit Neumorphismus formatiert ist, dunkles Design unterstützt und Platzhalterbilder enthält.
HTML-Code
<div class="bg-gray-200 dark:bg-gray-800 p-6 rounded-lg shadow-lg flex flex-col items-center">
<h2 class="text-lg font-semibold text-gray-800 dark:text-gray-200 mb-4">Maps Component</h2>
<div class="bg-white dark:bg-gray-700 rounded-lg p-4 shadow-xl w-full md:w-96">
<img src="https://picsum.photos/400/300" alt="Placeholder Map" class="rounded-lg w-full h-auto" />
</div>
<div class="flex mt-4">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" class="rounded-full w-10 h-10 border-2 border-white dark:border-gray-800 shadow-md" />
<div class="ml-3">
<p class="text-sm text-gray-700 dark:text-gray-300">User Name</p>
<p class="text-xs text-gray-500 dark:text-gray-400">Location</p>
</div>
</div>
</div>Verwandte Komponenten
Minimalistische monochromatische Business Maps-Komponente
Eine reaktionsschnelle und interaktive Kartenkomponente, die für Geschäfts- und Unternehmenswebsites entwickelt wurde und sich durch ein minimalistisches, flaches Design, ein monochromatisches Farbschema und Unterstützung für den Dunkelmodus auszeichnet. Enthält einen Platzhalter, ein Kartenbild und Platzhalter für Kontaktdetails.
Retro Maps-Komponente
Eine einfache, reaktionsschnelle und mit dem Dunkelmodus kompatible Kartenkomponente mit Retro-/Vintage-Ästhetik, lebendigem Farbschema und Geschäfts-/Unternehmenszwecken, die mit Tailwind CSS erstellt wurde.
Maps-Komponente
Eine komplexe Kartenkomponente, die im Material Design-Stil entworfen wurde und für Dashboards geeignet ist. Es integriert reaktionsschnelle Elemente, interaktive Funktionen und unterstützt die Ästhetik des Dunkelmodus mit einem analogen Farbschema.