Home
Andrés Abarzúa
Product Card for eCommerce

Product Card for eCommerce

Here is a Product Card with discount badge, price with discount and price normally.
On other hand, buttons for up or down quantity and add to cart button.
This is create for Grid Columns, wich can 4 or 5 depend for desktop

This tailwind example is contributed by Andrés Abarzúa, on 08-Jul-2025. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are Product Showcase, Product card

Card Product eCommerce

Author Andrés Abarzúa

Fork Fullscreen

<div class="relative flex flex-col overflow-hidden rounded-lg border border-gray-100 bg-white shadow-md max-w-xs m-4">
  <a href="#" class="relative mx-3 mt-3 flex h-40 overflow-hidden rounded-xl">
    <img 
      src="https://administracion.dlds.cl/1762/1762.jpg"
      alt="Bong de vidrio 25cm"
      loading="lazy"
      class="object-contain w-full h-full"
    />
  </a>
  <div class="flex flex-col flex-grow mt-2 px-3 pb-3">
    <a href="/p/1/bong-vidrio-25cm" class="block relative group">
      <h5 class="text-xs tracking-tight text-slate-900 font-bold flex items-center">
        Bubbler Kush - Bonglab
        <span class="ml-1"></span>
      </h5>
    </a>
    <div class="mt-auto">

Related Examples

Product Page
Showcase for the product.

Author:
Prem..

2 years ago

29.8k
Product card for eCommerce website

Author:
Steven Kuhn

2 years ago

12.1k
Product / Service Card
Example of a card that can be used as a blog, product, or service card with reviews.

Author:
Noob

2 years ago

16.6k
Products card grid
Example of product card grid with product image and pricing

Author:
Noob

2 years ago

22.4k
Product card

Author:
Simon Scheffer

2 years ago

29.3k
Product card

Author:
Oliver Hansen

2 years ago

9.5k
Product card

Author:
Oliver Hansen

2 years ago

13.1k
Products cards w/ hover effect
Example of product card grid with product image, pricing and a hover effect FORKED FROM: https://tailwindflex.com/noob_dev/products-card-grid

Author:
threehymns

1 year ago

17.4k
Card Component
A Simple Card Component with full responsiveness and dark mode supported

Author:
Shariar Hasan

1 year ago

3.1k
Product card
sleek and modern product card

Author:
OmKar Mehta

1 year ago

5.5k
Minimal Card
This is awesome looking card

Author:
Shaik Sameer Basha

1 year ago

2.1k
Card-Product
Item or card to show products

Author:
Ameth Galarcio

1 year ago

3.1k

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components