Komponente der Schaltfläche "In den Warenkorb"
Ein komplexer "In den Warenkorb"-Button mit Retro-/Vintage-Ästhetik und komplementärem Farbschema, der sich für eine professionelle Unternehmenswebsite eignet. Diese Komponente unterstützt den Dunkelmodus und ist reaktionsschnell, wobei Tailwind CSS für das Styling verwendet wird.
HTML-Code
<div class="flex items-center justify-center p-5 bg-gradient-to-r from-pink-500 to-yellow-500 rounded-lg transition duration-300 ease-in-out hover:scale-105 dark:from-pink-800 dark:to-yellow-700"> <img src="https://picsum.photos/40/40" alt="Product Image" class="rounded"> <div class="ml-4"> <h2 class="text-lg font-bold text-gray-900 dark:text-gray-100">Product Title</h2> <p class="text-sm text-gray-700 dark:text-gray-300">This is a brief description of the product.</p> </div> <button class="ml-auto bg-blue-500 text-white font-semibold py-2 px-4 rounded hover:bg-blue-600 dark:bg-blue-700 dark:hover:bg-blue-800">Add to Cart</button> <img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" class="ml-4 h-10 w-10 rounded-full border-2 border-blue-500 dark:border-blue-700"> </div>
Verwandte Komponenten
Komponente der Schaltfläche "In den Warenkorb"
Eine von der Natur inspirierte, bonbonfarbene "In den Warenkorb"-Button-Komponente, die für ein Forum/eine Community-Plattform entwickelt wurde und einen fließenden, organischen Stil aufweist. Es ist reaktionsschnell und unterstützt den Dunkelmodus.
In den Warenkorb Button-Komponente - Memphis Graustufen Wetter
Eine komplexe "In den Warenkorb"-Schaltflächenkomponente mit Memphis-Design-Inspiration unter Verwendung eines Graustufen-Farbschemas, angepasst an ein Wetter-/Klimaprodukt. Zu den Funktionen gehören ein dynamisches Symbol, ein Ladestatus, eine Impulsanimation und eine Elementanzahl, die alle reaktionsschnell sind und den Dunkelmodus unterstützen. Diese Komponente ist als spielerischer und dennoch funktionaler Call-to-Action für Wetterdaten-Abonnements oder klimabezogene Produkte konzipiert.
Komponente der Schaltfläche "In den Warenkorb"
Eine vom Brutalismus inspirierte Add-to-Cart-Button-Komponente mit Tailwind CSS mit hohem Kontrast, ungewöhnlichen Layouts, responsiven Effekten und Unterstützung für dunkle Themen.