360°-Viewer-Komponente
Eine minimalistische 360°-Viewer-Komponente, die mit Tailwind CSS entworfen wurde, mit responsiven Effekten und Unterstützung für dunkle Themen.
HTML-Code
<div class="flex flex-col items-center justify-center bg-white dark:bg-gray-800 p-6 rounded-lg shadow-lg">
<h2 class="text-2xl font-bold mb-4 text-gray-800 dark:text-white">360° Viewer</h2>
<div class="overflow-hidden rounded-lg w-full max-w-md">
<img src="https://picsum.photos/600/400?random" alt="360° view" class="w-full transition-transform duration-500 transform hover:scale-105" />
</div>
<p class="mt-4 text-gray-600 dark:text-gray-300 text-center">Hover to see the view.</p>
<div class="mt-6 flex space-x-4">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" class="h-12 w-12 rounded-full border-2 border-white dark:border-gray-800 shadow" />
<img src="https://randomuser.me/api/portraits/women/1.jpg" alt="User Avatar" class="h-12 w-12 rounded-full border-2 border-white dark:border-gray-800 shadow" />
<img src="https://randomuser.me/api/portraits/men/2.jpg" alt="User Avatar" class="h-12 w-12 rounded-full border-2 border-white dark:border-gray-800 shadow" />
</div>
</div>
Verwandte Komponenten
360°-Viewer-Komponente
Eine 360°-Viewer-Komponente mit einem neumorphen Design, responsiven Effekten und Unterstützung für dunkle Designs mit Tailwind CSS. Es verfügt über einen Container mit subtilen Schatten und abgerundeten Ecken, einen Bildplatzhalter und Navigationspfeile, die mit dem Neumorphic-Effekt gestaltet sind.
360°-Viewer-Komponente
Eine einfache 360°-Viewer-Komponente, die in einem brutalistischen Stil für E-Commerce-Zwecke entworfen wurde, mit einem triadischen Farbschema und einem responsiven Design mit Unterstützung für dunkle Themen.
360°-Viewer-Komponente
Eine 360°-Viewer-Komponente im Glassmorphism-Designstil mit responsiven Effekten und Unterstützung für dunkle Themen.