CREMA — Specialty Coffee Roaster & Café
Roasted to the moment.
A warm, editorial storefront for a specialty coffee roaster and café — a typed nine-bean shop with origin, process and roast data, step-by-step brew guides, a wholesale programme and a persistent nanostores cart. Every illustration is inline SVG and every font is self-hosted, so it deploys as a fast, self-contained static site.
Role · Design + front-end build (Astro; demo commerce + forms) · Updated Jun 2026
- 25 prerendered pages across 10 routes (home, shop + bean detail, brew guides, wholesale, about, locations, journal, cart, contact)
- A typed TypeScript data layer (beans, guides, journal, locations, team)
- A persistent nanostores cart island with a demo checkout
- Self-hosted Fraunces + Hanken Grotesk via @fontsource — zero runtime font requests
- Delivery
- 24–48h
- Licence
- One-time licence · full source
- Support
- 14 days setup support
- Updates
- Free updates included
Backend · Headless commerce / forms
A typed bean catalogue + nanostores cart with clean seams — connect Shopify (headless) or Stripe Checkout for live commerce; wire the wholesale/contact forms to any provider.
Delivered as full Astro source. Connect Shopify or Stripe for live commerce and wire the forms to your provider.
What makes it special
A full bean catalogue
Nine typed single-origins and blends — each with origin, process, roast level, tasting notes, SCA score and multiple bag sizes — with client-side filtering by roast level and process on the shop.
Persistent island cart
A lightweight nanostores + @nanostores/persistent cart island survives refreshes, shows a live nav badge, has quantity steppers and a clearly-labelled demo checkout — no framework runtime beyond the island.
Inline-SVG illustration system
Zero external images: an animated hero dripper with steam, a flavour wheel, a stylised café map and roast-aware bean illustrations that recolour from the data layer.
Step-by-step brew guides
Four detailed guides (V60, AeroPress, French Press, Espresso) with numbered step timelines, ratios, water temperatures and equipment — all statically generated.
Wholesale programme
A three-tier partnership pitch with a stats grid and a validated inquiry form, ready to wire to any form backend.
What’s included
- 25 prerendered pages across 10 routes (home, shop + bean detail, brew guides, wholesale, about, locations, journal, cart, contact)
- A typed TypeScript data layer (beans, guides, journal, locations, team)
- A persistent nanostores cart island with a demo checkout
- Self-hosted Fraunces + Hanken Grotesk via @fontsource — zero runtime font requests
- Inline-SVG art throughout, reduced-motion fallbacks, WCAG 2.2 AA, static export
Gallery
More Food & Drink templates
Make CREMA yours.
Buy it as-is, or have YantraCore tailor it to your brand and content.