3D-monochromatischer Videoplayer
Eine reaktionsschnelle Videoplayer-Komponente mit 3D-Designelementen und monochromatischem Farbschema, die sich für ein Dashboard eignet.
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>
Verwandte Komponenten
Videoplayer (Videoplayer)
Videoplayer-Komponente mit Mikrointeraktionen, komplementärem Farbschema, moderater Komplexität und responsivem Design mit Unterstützung für dunkles Design für die Portfolio-Verwendung.
Videoplayer-Komponente
Eine reaktionsschnelle Videoplayer-Komponente, die im Brutalismus-Stil mit Unterstützung für dunkle Themen gestaltet ist. Es zeichnet sich durch einen hohen Kontrast und ein fettes Layout aus, verwendet Tailwind CSS für das Styling und enthält Platzhalterbilder und Avatare.
Videoplayer-Komponente
Eine Videoplayer-Komponente im Brutalismus-Stil mit hohem Kontrast und ungewöhnlichem Layout, mit responsivem Design und Unterstützung für dunkle Themen mit Tailwind CSS.