Componentes Botón Añadir a la cesta Añadir al carrito Componente de botón

Añadir al carrito Componente de botón

Un botón responsivo 'Agregar al carrito' diseñado en modo oscuro usando Tailwind CSS, con efectos de desplazamiento y soporte para temas oscuros.

Vista previa

Código 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>

Componentes relacionados

Organic_Nature_Add_To_Cart_Button

Un componente de botón 'Agregar al carrito' inspirado en lo orgánico / naturaleza con un esquema de color complementario, adecuado para plataformas educativas. Cuenta con líneas fluidas, elementos interactivos sutiles, capacidad de respuesta total y compatibilidad con el modo oscuro.

Abrir

Añadir al carrito Componente de botón

Un componente de botón Agregar al carrito de estilo 3D con colores vibrantes, diseño receptivo y soporte de tema oscuro usando Tailwind CSS.

Abrir

Añadir a la cesta Botón Componente 46

Un componente de botón 'Agregar al carrito' retro / vintage diseñado con Tailwind CSS, con diseño receptivo y soporte para temas oscuros.

Abrir