Composant Visionneuse à 360°
Un composant de visualisation simple à 360° utilisant le style Glassmorphism et un design réactif avec prise en charge du mode sombre.
HTML Code
<div class="flex flex-col items-center justify-center min-h-screen bg-gray-100 dark:bg-gray-900 p-4">
<div class="relative w-full max-w-2xl bg-white dark:bg-gray-800 rounded-lg overflow-hidden shadow-lg backdrop-filter backdrop-blur-md bg-opacity-30 dark:bg-opacity-30">
<div class="p-6">
<h2 class="text-2xl font-semibold text-gray-800 dark:text-white">360° Viewer</h2>
<p class="mt-2 text-gray-600 dark:text-gray-300">Explore the item from all angles with our 360° viewer. Use your mouse or finger to rotate.</p>
</div>
<div class="flex justify-center">
<img src="https://picsum.photos/600/400?random=1" alt="360° View" class="w-full h-auto rounded-b-lg">
</div>
<div class="flex items-center justify-around p-4">
<img src="https://randomuser.me/api/portraits/men/32.jpg" alt="Avatar" class="w-12 h-12 rounded-full border-2 border-white dark:border-gray-800">
<img src="https://randomuser.me/api/portraits/women/32.jpg" alt="Avatar" class="w-12 h-12 rounded-full border-2 border-white dark:border-gray-800">
</div>
</div>
</div>Composants associés
Composant Visionneuse à 360°
Un simple composant de visualisation à 360° stylisé en Material Design avec des tons de terre pour un contexte de commerce électronique. Il comprend un design réactif avec prise en charge du mode sombre, présentant des images de picsum.photos et des avatars de randomuser.me.
Composant Visionneuse à 360°
Un composant simple de visualisation à 360° conçu dans un style brutaliste à des fins de commerce électronique, avec une palette de couleurs triadique et un design réactif avec prise en charge du thème sombre.
Composant Visionneuse à 360°
Un composant de visionneuse à 360° simple et réactif conçu avec le style Glassmorphism et une palette de couleurs pastel pour la consommation de contenu de blog, y compris la prise en charge du mode sombre.