Previous Category Card Next Collection Banner

Category Grid

Responsive grid of category cards for top-level navigation.

This page is a scaffold for the Category Grid component. Build the live markup, Alpine.js interactions, and DaisyUI/Tailwind classes here, then replace this placeholder block with the real preview + code snippet.

Planned variants & states to implement:

  • 2 / 3 / 4 / 6 column
  • Responsive collapse
  • With subcategories
  • Image fill variant
  • Text-only variant
7

Category Card

Image card with category name, product count, and link.

Collection Banner

Full-width or split banner promoting a curated collection.

Collection Grid

Grid layout for collection cards with image and label.

Collection Carousel

Scrollable carousel of collections with auto-advance option.

Brand Grid

Logo grid for browsing products by brand.

Brand Card

Individual brand card with logo, name, and product count.

Featured Collection

Hero-style block highlighting a curated or seasonal collection.
Previous Category Card Next Collection Banner