Componente lettore video
Un componente del lettore video neomorfico progettato per la presentazione del portfolio, caratterizzato da un tema scuro e un design reattivo utilizzando Tailwind CSS.
Codice HTML
<div class="flex flex-col items-center justify-center p-6 bg-gray-200 dark:bg-gray-900 rounded-lg shadow-lg">
<div class="bg-gray-300 dark:bg-gray-800 w-full md:w-3/4 rounded-xl overflow-hidden shadow-inner">
<video controls class="w-full h-auto">
<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="mt-4 text-center">
<h2 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Showcase Title</h2>
<p class="text-gray-600 dark:text-gray-400">A short description of the video content goes here. Highlight your work effectively.</p>
</div>
<div class="flex items-center mt-4">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" class="w-10 h-10 rounded-full border-2 border-gray-300 dark:border-gray-700 shadow-inner">
<div class="ml-3">
<span class="text-gray-800 dark:text-gray-200 font-semibold">User Name</span>
</div>
</div>
</div>Componenti correlati
Lettore video
Componente lettore video con microinterazioni, combinazione di colori complementari, complessità moderata e design reattivo con supporto del tema scuro per l'uso del portfolio.
Componente lettore video
Un componente del lettore video progettato con vetromorfisma, caratterizzato da un effetto simile al vetro smerigliato con colori complementari. È interattivo e reattivo, adatto per il consumo di contenuti di blog con supporto per temi scuri.
Componente del lettore video in modalità oscura retrò
Un componente per lettore video reattivo progettato per applicazioni sportive/fitness, dotato di una tavolozza di colori tenui retrò e supporto completo della modalità scura. Include video segnaposto e controlli con una timeline.