Componente pulsante Aggiungi al carrello
Un pulsante reattivo Aggiungi al carrello progettato per la modalità oscura utilizzando Tailwind CSS.
Codice HTML
<div class="flex items-center justify-center p-10 bg-gray-900 min-h-screen">
<div class="bg-gray-800 rounded-lg shadow-lg p-6">
<div class="flex items-center">
<img src="https://picsum.photos/100" alt="Product Image" class="w-16 h-16 rounded-lg mr-4">
<div class="text-white">
<h2 class="text-lg font-semibold">Product Name</h2>
<p class="text-gray-400">Product description goes here.</p>
<p class="text-xl font-bold mt-2">$29.99</p>
</div>
</div>
<button class="mt-4 w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded transition duration-200 ease-in-out">
Add to Cart
</button>
</div>
</div>Componenti correlati
Componente pulsante Aggiungi al carrello
Un componente pulsante reattivo "Aggiungi al carrello" per siti Web di viaggi/turismo, ispirato al design della carta/stampa con toni caldi del tramonto. Include il supporto per la modalità oscura e un sottile effetto interattivo.
Componente pulsante Aggiungi al carrello
Un componente reattivo del pulsante Aggiungi al carrello progettato in stile brutalista con colori vivaci, adatto per interfacce di social media con supporto per temi scuri.
Componente pulsante Aggiungi al carrello
Pulsante Aggiungi al carrello progettato per l'interfaccia utente in modalità oscura con combinazione di colori dei toni della terra e livello di complessità complesso, per scopi di portfolio. Il componente è reattivo e supporta il tema scuro utilizzando il prefisso dark: di Tailwind.