Kiln is a café website that doesn't look like a template.
Kiln is built around an idea: a coffee bar inside a pottery studio. Home, Menu, Story and even the 404 page are built around a drawing — a cup thrown on the wheel, the five stages of making it, a kiln firing chart that draws itself, a cup that cracked in the kiln.
Five pages
- Home — an animated hero where a cup is drawn as it's thrown, this week's drinks, a studio story with a self-drawing chart, address, map and hours.
- Menu — categories with photos, prices, badges and a sweetness scale. Filter by Hot, Iced or Dairy-free.
- Story — the café's story, five stages of making a cup, the people behind it.
- Visit — a booking request form, opening hours with today highlighted, map and directions.
- 404 — a "page not found" page in the same style.
Easy to make your own
- All content in one file: every word, price, photo and opening hour lives in src/data/site.json.
- Live open / closed line worked out from your hours and time zone.
- Booking form that works on Netlify Forms out of the box, or with Formspree anywhere else.
- Colours and fonts in one place: change seven colour values and every page follows.
- Drawings are code, not images, so they stay sharp on any screen.
Built properly
- Lighthouse (mobile) 96–100 on every page of the demo
- Valid HTML on every page
- Respects prefers-reduced-motion; the hero has a pause button; everything reads without JavaScript
- Link previews for WhatsApp, LINE, Facebook and X
- The whole built site is under 1 MB
What you need
Node.js 22.23.4 or newer (24 LTS recommended) and a terminal. Hosts anywhere static: Netlify, Vercel, Cloudflare Pages, GitHub Pages.
Built with Astro 7, Tailwind CSS 4 and GSAP. One purchase = one website, for yourself or for one client.
