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.
Código 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>Componentes relacionados
Componente de reproductor de vídeo
Un componente de reproductor de vídeo complejo y de alto contraste con estética de Material Design, adecuado para sitios web de viajes y turismo. Cuenta con diseño responsivo, soporte para modo oscuro y elementos interactivos.
Componente de reproductor de vídeo inmobiliario
Un componente de reproductor de video complejo y receptivo para plataformas inmobiliarias, con una estética de Material Design con una paleta de colores bosque/verde. Incluye control de video, detalles de propiedades y una lista de reproducción, con soporte completo para el modo oscuro.
Componente de reproductor de vídeo
Un componente de reproductor de vídeo sensible diseñado para el modo oscuro con un esquema de color análogo para el consumo de contenido.