Sale

A full-width inverted sale hero for shadcn/ui with a destructive "Black Week" Badge, an oversized "Up to 40% off" heading, a lead paragraph, two Buttons and a small end-time line with a clock icon. Centred and fully responsive. Built for seasonal landing pages and campaign takeovers.

A bordered sale strip for shadcn/ui with a live countdown driven by useEffect that ticks every second toward a fixed end date. Days, hours, minutes and seconds sit in muted tabular-nums boxes next to the sale copy and a shop Button. The row stacks vertically on mobile. Perfect above product grids during a promotion.

Four category discount tiles for shadcn/ui in a two-column grid that widens to four columns. Each tile layers a dark overlay over a product photo with an oversized "-20%" style deal, a category name and a short line, and scales the image on hover. A heading and "View everything on sale" link sit above.

A centred muted panel for shadcn/ui offering 10% off a first order. The WELCOME10 code sits in a dashed box beside a Copy Button whose icon swaps to a Check through useState, followed by a newsletter Input and Subscribe Button and a terms line. Great for welcome offers on the home page or in the footer area.

A clearance grid for shadcn/ui with a "Last chance" heading and an "Ends in 3 days" Badge. Eight product cards show square photos, destructive discount Badges, sale prices beside strike-through originals in tabular-nums and "Only 2 left" stock lines on selected items. Two columns on mobile, four on desktop.

A split sale banner for shadcn/ui inside a rounded, bordered frame with a thin "Free returns on sale items" top bar. A lifestyle photo fills the left half while the right half is a primary-coloured panel with a "Summer clearance" heading, three check bullets and a secondary Button. Stacks photo over panel on mobile.