360°-Viewer-Komponente
Eine 360°-Viewer-Komponente mit responsivem Design und Unterstützung für dunkle Themen unter Verwendung von Tailwind CSS. Verwendet CSS für Animationen und Interaktionen für ein Mikrointeraktionsgefühl. Kein JavaScript.
HTML-Code
<div class="flex justify-center items-center h-screen bg-gray-200 dark:bg-gray-800">
<div class="relative w-64 h-64">
<div class="absolute inset-0 bg-cover bg-center transform transition-transform duration-500 ease-in-out hover:rotate-180" style="background-image: url('https://picsum.photos/id/237/256/256');"></div>
<div class="absolute inset-0 flex justify-center items-center opacity-0 hover:opacity-100 transition-opacity duration-300">
<div class="text-white text-xl font-bold">View 360</div>
</div>
</div>
</div>Verwandte Komponenten
360°-Viewer-Komponente
Eine einfache 360°-Viewer-Komponente, die für den E-Commerce entwickelt wurde, mit Mikrointeraktionen und einem Farbschema in Erdtönen, mit Unterstützung für den Dunkelmodus.
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 reaktionsschnelle 360°-Viewer-Komponente, die für Dashboards mit einem 3D-Designstil und Unterstützung für den Dunkelmodus entwickelt wurde.