Componente de reproductor de vídeo
Un componente de reproductor de video de estilo brutalismo con alto contraste y diseño inusual, con diseño responsivo y soporte de temas oscuros usando Tailwind CSS.
Código HTML
<div class="flex flex-col items-center justify-center bg-gray-100 dark:bg-gray-900 p-4 rounded-lg">
<div class="relative w-full max-w-2xl rounded-lg overflow-hidden shadow-lg">
<video class="w-full h-auto" controls>
<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<div class="absolute inset-0 bg-black opacity-50"></div>
</div>
<div class="mt-4 text-center text-lg font-bold text-gray-800 dark:text-white">Bold Video Title</div>
<div class="mt-2 text-center text-gray-600 dark:text-gray-300">An engaging video description goes here.</div>
<div class="mt-4 flex items-center justify-center space-x-4">
<img src="https://picsum.photos/50/50" alt="User Avatar" class="rounded-full border-2 border-gray-800 dark:border-white">
<p class="text-sm font-semibold text-gray-800 dark:text-white">User Name</p>
</div>
<div class="mt-4 flex justify-between w-full max-w-md">
<button class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">Like</button>
<button class="bg-red-600 hover:bg-red-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">Dislike</button>
</div>
</div>Componentes relacionados
Brutalist_RealEstate_VideoPlayer
Un componente complejo de reproducción de video de estilo brutalista para listados de bienes raíces, con alto contraste, una paleta de colores bosque / verde y diseño receptivo con soporte para modo oscuro. Incluye detalles de la propiedad, información del agente y botones de acción.
Componente de reproductor de vídeo
Un componente de reproductor de video receptivo diseñado con una estética inspirada en el papel / impresión y una combinación de colores complementaria, adecuada para plataformas de foros o comunidades. Incluye soporte para modo oscuro y HTML semántico.
Componente de reproductor de video de modo oscuro retro
Un componente de reproductor de video receptivo diseñado para aplicaciones deportivas / fitness, con una paleta de colores retro apagados y soporte completo para el modo oscuro. Incluye vídeo de marcador de posición y controles con una línea de tiempo.