Composant d’affichage du contenu
Un composant d’affichage de contenu avec une conception glassmorphism avec une mise en page réactive et une prise en charge du thème sombre.
HTML Code
<div class="flex flex-col items-center justify-center min-h-screen bg-gray-100 dark:bg-gray-900 p-4">
<div class="bg-white dark:bg-gray-800 bg-opacity-30 backdrop-blur-md rounded-lg shadow-lg p-6 max-w-lg">
<h2 class="text-2xl font-bold text-gray-800 dark:text-white">Featured Content</h2>
<p class="text-gray-700 dark:text-gray-300 mt-2">This is a content display component that utilizes glassmorphism design principles. It features a blurred background and translucent elements for a modern look.</p>
<div class="mt-4">
<img src="https://picsum.photos/300/200" alt="Random Image" class="rounded-lg" />
</div>
<div class="mt-4 flex items-center">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar" class="w-10 h-10 rounded-full border-2 border-white dark:border-gray-800 mr-3" />
<span class="text-gray-600 dark:text-gray-300">John Doe</span>
</div>
</div>
</div>
Composants associés
Composant Composants d’affichage de contenu
Un composant d’affichage de contenu réactif avec prise en charge du mode sombre pour les sites Web d’entreprise.
Composant Composants d’affichage de contenu
Un composant d’affichage de contenu avec des microinteractions, une conception réactive et la prise en charge du thème sombre à l’aide de Tailwind CSS. Propose des effets de survol subtils et des animations de concentration sur des éléments interactifs.
Memphis_Content_Display_Component
Composant d’affichage de contenu complexe et réactif pour les plateformes de divertissement/médias, avec un style Memphis Design avec une palette de couleurs noir et blanc et une couleur d’accentuation vive (fuchsia). Inclut la prise en charge du mode sombre et des images de repère d’emplacement.