Product List Sections

This Shadcn product list section block displays products in a clean grid with consistent cards for image, price, and actions. Displays products in a three-column grid where each card includes a product image, name, price, rating and an action button (e.g., "Add to cart"). Ideal for medium-sized screens.

Similar to the first but fits four products per row, giving a denser view suitable for wider displays.

Compact list view – A variant that focuses on a slim list or carousel with minimal text, prioritising quick browsing, and often used at the end of the page to showcase additional items.

This Shadcn product list section block adds a horizontal carousel pattern with category cues for easier browsing. A horizontally scrollable carousel of product cards grouped by categories; each slide shows product images with small labels indicating the category and discount badges.

Responsive carousel/grid – On mobile, products are shown in a swipeable carousel; on larger screens they switch to a multi-column grid, ensuring usability across devices.

This Shadcn product list section block introduces a clear section heading while keeping the responsive carousel-to-grid behaviour. Same responsive behaviour as above but introduces a centred section title ("Featured products" or similar) above the carousel/grid.