Componentes Visor de 360° Componente de visor de 360°

Componente de visor de 360°

Un sencillo componente de visor de 360° diseñado en Material Design con tonos tierra para un contexto de comercio electrónico. Incluye un diseño responsivo con soporte para el modo oscuro, mostrando imágenes de picsum.photos y avatares de randomuser.me.

Vista previa

Código HTML

<div class="container mx-auto p-4">
    <div class="bg-white dark:bg-gray-800 rounded-lg shadow-lg p-6">
        <h2 class="text-2xl font-bold text-gray-800 dark:text-white">360° Product Viewer</h2>
        <div class="mt-4 flex justify-center items-center">
            <img src="https://picsum.photos/500/300?random=1" alt="360° View" class="rounded-lg shadow-md transition-transform duration-300 hover:scale-105">
        </div>
        <div class="mt-4 text-center">
            <p class="text-gray-600 dark:text-gray-300">Explore our product from all angles. Rotate to view details and features.</p>
        </div>
        <div class="mt-6 flex justify-center">
            <button class="bg-green-600 dark:bg-green-800 text-white font-semibold py-2 px-4 rounded shadow-md hover:bg-green-500 dark:hover:bg-green-700 transition duration-200">Buy Now</button>
        </div>
        <div class="mt-6 text-center">
            <img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" class="rounded-full w-12 h-12 shadow-lg">
            <p class="mt-2 text-gray-600 dark:text-gray-300">John Doe - E-commerce Specialist</p>
        </div>
    </div>
</div>

Componentes relacionados

360_Viewer_Component

Un complejo componente de visor de 360° con diseño de cristal, combinación de colores en escala de grises y elementos interactivos, adecuado para plataformas educativas. Incluye capacidad de respuesta completa y soporte para modo oscuro.

Abrir

Componente de visor de 360°

Un componente de visor de 360° diseñado con un estilo esqueuomórfico, utilizando un esquema de color en escala de grises. Cuenta con una interfaz de complejidad media adecuada para aplicaciones de redes sociales, que admite temas claros y oscuros.

Abrir

360_viewer_component

Un componente de visor de 360° sensible diseñado para herramientas de CRM/Business con una interfaz de usuario de modo oscuro y una combinación de colores neón/eléctrico.

Abrir