Composant du lecteur vidéo
Un composant de lecteur vidéo néomorphique conçu pour la présentation de portfolios, avec un thème sombre et un design réactif à l’aide de Tailwind CSS.
HTML Code
<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>
Composants associés
Composant du lecteur vidéo
Un lecteur vidéo de style Glassmorphism avec des éléments translucides semblables à du verre givré, une palette de couleurs pastel et une interface complexe adaptée aux sites Web d’entreprise. Il prend en charge le responsive design et un thème sombre utilisant Tailwind CSS, sans JavaScript.
Neon_Glow_Video_Player
Un composant de lecteur vidéo simple et réactif pour les sites Web d’entreprise, avec des effets de néon/lueur et une palette de couleurs chaudes de coucher de soleil. Inclut la prise en charge du mode sombre.
Composant du lecteur vidéo
Composant de lecteur vidéo avec style Glassmorphism, schéma de couleurs analogue et complexité modérée à des fins de blog/contenu, avec une conception réactive et une prise en charge du thème sombre à l’aide de Tailwind CSS. Pas de Javascript.