Простой просмотрщик 360 градусов (стеклянный морфизм в оттенках серого)
Простой, отзывчивый компонент 360 viewer с дизайном glassmorphism в оттенках серого, подходящий для электронной коммерции. Поддерживает темный режим.
HTML-код
```html
<div class="flex items-center justify-center min-h-screen bg-gray-100 dark:bg-gray-900 p-4">
<div class="relative w-full max-w-sm bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden backdrop-filter backdrop-blur-lg bg-opacity-20 dark:bg-opacity-20">
<!-- 360 Viewer Area (Placeholder) -->
<div class="relative w-full h-64 bg-gray-300 dark:bg-gray-700 flex items-center justify-center">
<span class="text-gray-600 dark:text-gray-400 text-sm">360° Viewer Placeholder</span>
<!-- In a real implementation, a JavaScript library or iframe would go here -->
</div>
<!-- Product Info -->
<div class="p-4">
<h3 class="text-lg font-semibold text-gray-800 dark:text-white mb-2">Product Name</h3>
<p class="text-gray-600 dark:text-gray-300 text-sm mb-4">Brief product description goes here.</p>
<div class="flex justify-between items-center">
<span class="text-xl font-bold text-gray-900 dark:text-white">$99.99</span>
<button class="px-4 py-2 bg-gray-700 text-white text-xs font-semibold rounded hover:bg-gray-600 dark:bg-gray-600 dark:hover:bg-gray-500">Add to Cart</button>
</div>
</div>
</div>
</div>
```
Связанные компоненты
Компонент 360 Viewer
Компонент 360-градусного просмотра с дизайном Glassmorphism, монохроматической цветовой схемой и умеренной сложностью. Он предназначен для блогов/контентных целей, является адаптивным и поддерживает темный режим с использованием Tailwind CSS. JavaScript не включен, только HTML с классами Tailwind. Использует picsum.photos для изображений.
Компонент просмотра на 360°
Отзывчивый компонент 360° Viewer со скевоморфным дизайном, триадической цветовой схемой и поддержкой темных тем. Предназначен для визуализации данных дашбордов и панелей управления.
Компонент просмотра на 360°
Отзывчивый компонент 360° viewer, разработанный для дашбордов со стилем 3D-дизайна и поддержкой темного режима.