Lecteur vidéo monochromatique 3D
Un composant de lecteur vidéo réactif avec des éléments de conception 3D et une palette de couleurs monochromatiques, adapté à un tableau de bord.
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 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>
Composants associés
Composant du lecteur vidéo
Un composant de lecteur vidéo de style rétro/vintage avec un design réactif et une prise en charge du mode sombre à l’aide de Tailwind CSS.
Composant du lecteur vidéo
Composant de lecteur vidéo de conception matérielle avec mode sombre
Composant du lecteur vidéo
Un composant de lecteur vidéo réactif conçu dans le style glassmorphism, avec des éléments translucides semblables à du verre dépoli avec des effets de flou, la prise en charge des thèmes sombres et des images de remplacement.