Reproductor de vídeo monocromático 3D
Un componente de reproductor de video receptivo con elementos de diseño 3D y combinación de colores monocromática, adecuada para un tablero.
Código HTML
<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 rounded-lg shadow-xl overflow-hidden dark:shadow-2xl bg-white dark:bg-gray-800 transform transition-transform duration-500 hover:scale-105"> <div class="aspect-w-16 aspect-h-9"> <video controls class="w-full h-full object-cover"> <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4"> Your browser does not support the video tag. </video> </div> <div class="p-6"> <h3 class="text-2xl font-semibold text-gray-800 dark:text-white mb-3">Video Title</h3> <p class="text-gray-600 dark:text-gray-300">A brief description of the video content goes here. This is a sample video demonstrating the video player component with a 3D-like feel and monochromatic colors.</p> </div> <div class="absolute inset-0 pointer-events-none"> <div class="absolute inset-0 bg-gradient-to-br from-gray-200 via-transparent to-gray-300 opacity-20 dark:from-gray-700 dark:to-gray-800 rounded-lg"></div> </div> </div></div>
Componentes relacionados
Componente de reproductor de vídeo
Un componente de reproductor de video receptivo diseñado para un blog o consumo de contenido con microinteracciones y una combinación de colores pastel. Incluye funcionalidad de reproducción/pausa y un control de volumen. El diseño también incluye soporte para el modo oscuro.
Componente de reproductor de vídeo
Un componente de reproductor de video minimalista diseñado para interfaces de redes sociales, con un diseño receptivo con soporte para temas oscuros.
Componente de reproductor de vídeo
Un componente de reproductor de video neomórfico diseñado para la exhibición de portafolios, con un tema oscuro y un diseño receptivo que usa Tailwind CSS.