Componente visualizzatore a 360°
Un componente visualizzatore a 360° progettato con uno stile scheumorfico, utilizzando una combinazione di colori in scala di grigi. È dotato di un'interfaccia di media complessità adatta per applicazioni di social media, che supporta temi chiari e scuri.
Codice HTML
<div class="flex flex-col items-center justify-center p-6 bg-gray-100 dark:bg-gray-800 rounded-lg shadow-lg">
<h2 class="text-xl font-semibold text-gray-800 dark:text-gray-200">360° Viewer</h2>
<div class="mt-4 w-full max-w-md h-64 border border-gray-300 dark:border-gray-600 rounded-lg overflow-hidden shadow-inner">
<img src="https://picsum.photos/600/400?random=1" alt="360° View" class="w-full h-full object-cover transition-transform hover:scale-105 duration-300" />
</div>
<div class="mt-4 flex items-center">
<div class="flex-shrink-0">
<img class="w-10 h-10 rounded-full border border-gray-300 dark:border-gray-600" src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" />
</div>
<div class="ml-3">
<p class="text-sm font-medium text-gray-700 dark:text-gray-300">John Doe</p>
<p class="text-sm text-gray-500 dark:text-gray-400">Posted 1 hour ago</p>
</div>
</div>
<div class="mt-4">
<button class="px-4 py-2 text-white bg-gray-800 rounded hover:bg-gray-700 dark:bg-gray-600 dark:hover:bg-gray-500">Interact</button>
</div>
</div>Componenti correlati
PastelBrutalist360AssetViewer
Un componente Asset Viewer a 360° semplice e reattivo con uno stile di design brutalista e una combinazione di colori rosa pastello. Realizzato su misura per i cruscotti, è dotato di un segnaposto per immagini statiche (che simulano una vista a 360°), pulsanti di controllo non funzionanti e visualizzazione delle informazioni. Costruito con Tailwind CSS, supporta la modalità oscura e mostra un'estetica cruda e audace con bordi spessi e ombre sfalsate nette.
360DegreeViewerComponent
Un semplice componente per visualizzatori a 360 gradi con un design brutalista, colori complementari e supporto per la modalità oscura. Utilizza solo HTML e Tailwind CSS.
Componente visualizzatore a 360°
Un componente visualizzatore minimalista a 360° costruito con Tailwind CSS, con effetti reattivi e supporto per temi scuri.