Shadcn.io is not affiliated with official shadcn/ui
React Product Card Sale
Product card with sale pricing showing original and discounted price for React ecommerce
Highlight discounted products on your Next.js ecommerce store with this sale product card component. Features sale badge, original price with strikethrough, discounted price, savings percentage, and urgency messaging. Built with shadcn/ui Card, Button, and Badge components using Tailwind CSS. The promotional design drives conversions during sales—perfect for Shopify headless flash sales, clearance sections, Black Friday campaigns, or any React app running promotions. Accessible and SEO-friendly pricing markup.
React Product Card Sale preview
Installation
Related Components
React Product Card Simple
Standard product card
React Product Card Horizontal
Side-by-side layout
React Product Card Compact
Minimal product tile
React Product Card Variants
Color and size options
React Product Card Grid
Product grid layout
React Storefront Block Hero
Featured product showcase