Pulsante Aggiungi al carrello
Un componente pulsante Skeuomorphic "Aggiungi al carrello" progettato con Tailwind CSS, con effetti reattivi e supporto per temi scuri.
Codice HTML
<div class="flex items-center justify-center h-screen bg-gray-100 dark:bg-gray-900">
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-lg p-6 flex items-center space-x-4 transition-transform transform hover:scale-105">
<img src="https://picsum.photos/50" alt="Product Image" class="w-12 h-12 rounded-lg shadow">
<div class="flex-1">
<h2 class="text-lg font-bold text-gray-800 dark:text-gray-200">Product Name</h2>
<p class="text-gray-600 dark:text-gray-400">Short description of the product.</p>
</div>
<button class="bg-blue-500 text-white font-semibold py-2 px-4 rounded-lg shadow-md hover:bg-blue-400 transition duration-200">
Add to Cart
</button>
</div>
</div>Componenti correlati
Componente pulsante Aggiungi al carrello
Un componente pulsante Aggiungi al carrello in stile 3D con colori vivaci, design reattivo e supporto per temi scuri utilizzando Tailwind CSS.
Organic_Nature_Add_To_Cart_Button
Un componente pulsante "Aggiungi al carrello" organico/ispirato alla natura con una combinazione di colori complementari, adatto per piattaforme educative. Presenta linee fluide, sottili elementi interattivi, piena reattività e supporto per la modalità oscura.
Brutalismo Aggiungi al carrello Pulsante
Un semplice componente pulsante "Aggiungi al carrello" in stile brutalista con contrasto elevato, colori complementari e scopo per i social media. Completamente reattivo con supporto per la modalità oscura.