Komponente der Schaltfläche "In den Warenkorb"
In den Warenkorb Die Schaltfläche wurde für die Benutzeroberfläche im Dunkelmodus mit Erdtönen, Farbschema und komplexer Komplexität für Portfoliozwecke entwickelt. Die Komponente reagiert und unterstützt das dunkle Design mit dem Präfix dark: von Tailwind.
HTML-Code
<button class="bg-stone-700 hover:bg-stone-600 text-stone-100 py-3 px-6 rounded-lg font-semibold text-lg shadow-lg transition duration-300 ease-in-out dark:bg-stone-800 dark:hover:bg-stone-700 dark:text-stone-200 dark:shadow-xl"> <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 inline-block mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 11V7a4 4 0 00-4-4H8a4 4 0 00-4 4v4m11 0l-3 4m0 0h3v3zm-3-4v1m10-4v2a2 2 0 01-2 2H7a2 2 0 01-2-2V7a2 2 0 012-2h10a2 2 0 012 2z" /> </svg> Add to Cart </button>
Verwandte Komponenten
In den Warenkorb Button
Ein Skeuomorphic Add to Cart-Button mit responsiven Effekten und Unterstützung für dunkle Themen.
Komponente der Schaltfläche "In den Warenkorb"
Eine reaktionsschnelle Schaltfläche "In den Warenkorb" mit ansprechenden Mikrointeraktionen, Sonnenuntergangs-/warmen Tönen, geeignet für Lebensmittel-/Restaurant-Websites, mit einer subtilen Animation beim Hover/Klicken und Unterstützung des Dunkelmodus.
In den Warenkorb Button
Responsive Schaltfläche "In den Warenkorb" mit skeuomorphem Design, monochromatischem Farbschema und Unterstützung für dunkle Themen.