Componente pulsante Aggiungi al carrello
Un pulsante reattivo "Aggiungi al carrello" progettato in modalità scura utilizzando Tailwind CSS, con effetti al passaggio del mouse e supporto per il tema scuro.
Codice HTML
<div class="flex items-center justify-center min-h-screen bg-gray-900 text-white">
<div class="flex flex-col items-center bg-gray-800 p-6 rounded-lg shadow-lg">
<img src="https://picsum.photos/200/300" alt="Product Image" class="w-full h-auto rounded-lg mb-4" />
<h2 class="text-lg font-semibold mb-2">Product Name</h2>
<p class="text-gray-400 mb-4">Short description of the product goes here.</p>
<div class="flex items-center justify-between w-full">
<span class="text-xl font-bold">$19.99</span>
<button class="bg-green-500 hover:bg-green-600 text-white font-bold py-2 px-4 rounded transition duration-300 ease-in-out">
Add to Cart
</button>
</div>
</div>
</div>Componenti correlati
Componente pulsante Aggiungi al carrello
Un componente pulsante Aggiungi al carrello ispirato al brutalismo con Tailwind CSS, caratterizzato da contrasto elevato, layout insoliti, effetti reattivi e supporto per temi scuri.
Pulsante Aggiungi al carrello
Un componente reattivo del pulsante Aggiungi al carrello progettato in uno stile scheumorfico, con colori vivaci e supporto per temi scuri, adatto per le interfacce dei social media.
Componente pulsante Aggiungi al carrello
Un componente del pulsante "Aggiungi al carrello" complesso e scheumorfico progettato per le interfacce di gioco, caratterizzato da una combinazione di colori analoga e una reattività completa con supporto per la modalità oscura.