Composant Mentions de l’utilisateur
Un composant de mention utilisateur avec conception 3D, effets réactifs et prise en charge du thème sombre à l’aide de Tailwind CSS.
HTML Code
<div class="flex items-center space-x-4 p-4 bg-white rounded-lg shadow-xl transition-transform transform hover:scale-105 dark:bg-gray-800">
<img class="w-12 h-12 rounded-full border-2 border-blue-500" src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar">
<div class="flex-1">
<p class="text-lg font-semibold text-gray-800 dark:text-white">John Doe</p>
<p class="text-gray-600 dark:text-gray-400">@johndoe</p>
</div>
<span class="inline-block bg-blue-500 text-white text-xs px-3 py-1 rounded-full shadow-md dark:bg-blue-600">
Mentioned
</span>
</div>
Composants associés
Composant Mentions de l’utilisateur
Un composant complexe de mentions d’utilisateur pour les outils CRM/Business, avec un schéma de couleurs dégradé violet/violet et des transitions fluides. Entièrement réactif avec prise en charge du mode sombre.
Composant Mentions d’utilisateur - Skeuomorphisme
L’utilisateur mentionne le composant avec la conception skeuomorphism, les effets réactifs et la prise en charge du thème sombre en utilisant uniquement html avec tailwind css. Pas besoin de javascript.
Composant Mentions de l’utilisateur
Composant mettant en œuvre le style Glassmorphism avec un design réactif et la prise en charge du mode sombre.