E-Commerce, DTC, Retail

Storefront

Product is hero. Action red for purchase CTAs only. Clean grids. Mobile-first commerce.

#

DESIGN_TOKENS.md

Color palette, typography scale, spacing, border radius, visual doctrine rules

path : monad-studio/themes/storefront/DESIGN_TOKENS.md
{ }

CSS_STARTER.css

Production-ready CSS foundation — copy into your project and customize tokens

path : monad-studio/themes/storefront/CSS_STARTER.css
#

AUDIT_CHECKLIST.md

Theme-specific audit framework with pass/fail checkpoints

path : monad-studio/themes/storefront/AUDIT_CHECKLIST.md

How to Use

  1. Copy CSS_STARTER.css into your project's stylesheet
  2. Adjust the CSS custom properties to match your brand colors
  3. Build components following the patterns in the starter
  4. Run AUDIT_CHECKLIST.md before every deployment
  5. Cross-reference shared/UNIVERSAL_RULES.md for accessibility and SEO