Componente de reproductor de vídeo
Un componente de reproductor de vídeo responsivo diseñado con el estilo Neumorphism, utilizando Tailwind CSS. Cuenta con soporte para el modo oscuro con sombras sutiles para dar una apariencia de interfaz de usuario suave.
Código HTML
<div class="flex items-center justify-center min-h-screen bg-gray-100 dark:bg-gray-900 p-4">
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-md p-6 max-w-lg w-full">
<div class="flex justify-center mb-4">
<video class="rounded-lg shadow-lg" controls>
<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="flex items-center">
<img class="w-10 h-10 rounded-full mr-3" src="https://randomuser.me/api/portraits/men/10.jpg" alt="Avatar">
<div class="text-sm">
<p class="text-gray-900 dark:text-white font-medium">John Doe</p>
<p class="text-gray-500 dark:text-gray-300">Uploaded 2 days ago</p>
</div>
</div>
<div class="mt-4">
<p class="text-gray-800 dark:text-gray-300">A brief description of the video content goes here. It can detail key points or the overall theme of the video.</p>
</div>
</div>
</div>Componentes relacionados
Componente de reproductor de vídeo
Un componente de reproductor de vídeo responsivo con Tailwind CSS centrado en las microinteracciones y la compatibilidad con temas oscuros.
Reproductor de video minimalista
Componente de reproductor de vídeo codificado en HTML con Tailwind CSS. Tiene un diseño minimalista que utiliza un esquema de color en escala de grises, destinado al uso en el tablero. Es un componente complejo con múltiples elementos interactivos y es totalmente responsivo con soporte para modo oscuro.
Brutalist_Video_Player
Un componente de reproductor de video de estilo brutalista para sitios web comerciales/corporativos, con alto contraste, tipografía audaz y una combinación de colores complementaria. Totalmente receptivo con soporte para modo oscuro.