Componente Visualizzazione contenuto
Un componente reattivo per mostrare lavori o prodotti in uno stile di modalità scura con una combinazione di colori pastello.
Codice HTML
<div class="bg-gray-800 dark:bg-gray-900 p-6 rounded-lg shadow-lg max-w-md mx-auto">
<h2 class="text-2xl font-bold text-pink-300 dark:text-pink-200 mb-4">Project Title</h2>
<img src="https://picsum.photos/400/200" alt="Project Image" class="rounded-lg mb-4 shadow-md">
<p class="text-gray-300 dark:text-gray-200 mb-4">This is a brief description of the project. It showcases the unique features and the value it brings to users.</p>
<div class="flex items-center mb-4">
<img src="https://randomuser.me/api/portraits/men/32.jpg" alt="Avatar" class="w-10 h-10 rounded-full mr-2 shadow-lg">
<span class="text-gray-400 dark:text-gray-200">Posted by John Doe</span>
</div>
<a href="#" class="inline-block bg-pink-500 hover:bg-pink-400 text-white font-semibold py-2 px-4 rounded mt-2">View More</a>
</div>Componenti correlati
Componente Visualizzazione contenuto
Un componente di visualizzazione dei contenuti reattivo con Glassmorphism, con sfondo sfocato ed elementi traslucidi con supporto per la modalità oscura.
Componenti di visualizzazione dei contenuti
Un semplice componente di visualizzazione di contenuti reattivi in stile vintage per l'e-commerce, che utilizza una combinazione di colori monocromatica e supporta la modalità scura.
Componente Visualizzazione contenuto
Un componente di visualizzazione nostalgico con un design retrò, con effetti reattivi e supporto per temi scuri.