Componente Componenti sociali
Un semplice componente reattivo per i social media con animazioni accattivanti e un tema scuro, che utilizza Tailwind CSS.
Codice HTML
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-lg p-6 transition-transform transform hover:scale-105 duration-300 ease-in-out">
<div class="flex items-center space-x-4 mb-4">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" class="w-12 h-12 rounded-full">
<div class="flex-1">
<h2 class="text-lg font-semibold text-gray-800 dark:text-white">John Doe</h2>
<p class="text-gray-600 dark:text-gray-400">@johndoe</p>
</div>
</div>
<div class="mb-4">
<p class="text-gray-700 dark:text-gray-300">This is a sample post demonstrating social media interactions with engaging microinteractions.</p>
</div>
<div class="flex space-x-4">
<button class="bg-blue-500 hover:bg-blue-600 text-white py-2 px-4 rounded transition duration-200 ease-in-out">
Like
</button>
<button class="bg-green-500 hover:bg-green-600 text-white py-2 px-4 rounded transition duration-200 ease-in-out">
Comment
</button>
<button class="bg-red-500 hover:bg-red-600 text-white py-2 px-4 rounded transition duration-200 ease-in-out">
Share
</button>
</div>
</div>Componenti correlati
Componente Componenti sociali
Componente Social Components con design Brutalism, effetti reattivi e supporto per temi scuri.
Componente Componenti sociali
Un componente social semplice ed elegante progettato per piattaforme musicali e audio con una combinazione di colori ad alto contrasto e uno stile lussuoso, con profilo utente, follower e metriche di coinvolgimento. Completamente reattivo con supporto per la modalità oscura.
Componente Componenti sociali
Una sezione di componenti social semplice e reattiva per una dashboard, caratterizzata da una combinazione di colori monocromatica e da un design ispirato allo scheumorfismo.