Ajouter au panier Bouton
Un bouton Skeuomorphic Ajouter au panier avec des effets réactifs et la prise en charge du thème sombre.
HTML Code
<button
class="bg-gradient-to-b from-gray-200 to-gray-300 dark:from-gray-700 dark:to-gray-800 text-gray-800 dark:text-gray-200 py-3 px-6 rounded-lg shadow-md hover:shadow-lg transition duration-300 ease-in-out"
>
<span class="flex items-center justify-center">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6 mr-2"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 11-4 0 2 2 0 014 0z"
></path>
</svg>
Add to Cart
</span>
</button>Composants associés
Ajouter au panier Bouton
Un bouton d’ajout au panier réactif stylisé avec les principes de conception matérielle à l’aide de Tailwind CSS, prenant en charge les thèmes en mode sombre.
Ajouter au panier Composant du bouton
Un bouton complexe Ajouter au panier conçu avec une esthétique rétro/vintage et une palette de couleurs complémentaire, adapté à un site Web d’entreprise professionnel. Ce composant prend en charge le mode sombre et est réactif, utilisant Tailwind CSS pour le coiffage.
Ajouter au panier Composant du bouton
Un composant de bouton Ajouter au panier de style 3D avec des couleurs vives, un design réactif et une prise en charge du thème sombre à l’aide de Tailwind CSS.