Supper is built for food publishing where the recipes have to work as well as they look. A post becomes a recipe by adding a recipe block to its frontmatter, and from that one block the theme prints a servings stepper that scales the shopping list, a metric and imperial switch that converts amounts and oven temperatures, tickable ingredients and steps, cook times on every card, a print sheet, and schema.org Recipe data. The front page is dealt from the archive rather than filled by hand, so a site with six recipes and one with six hundred both look deliberate. It combines static Astro performance, Markdown content collections, build-time image optimization, client-side search that covers ingredients, strong SEO defaults, accessible page structure, RSS, and sitemap support with a full-width, near-square, single colour mode design system.
Features
- A recipe block in frontmatter — servings, yield, prep, cook and resting time, difficulty, grouped ingredients, a numbered method, cook's notes, keeping notes, and required equipment — refused in the writing section so an essay can never grow an ingredient list
- Ingredient amounts stored as quantity, unit, and item, so the servings stepper scales them exactly and prints kitchen fractions rather than decimals, with a fixed flag for tin sizes and pinches
- A metric and imperial switch that converts the shopping list, oven temperatures, and the measurements written into the method, the cook's notes, and the article prose, remembered per browser
- Tickable ingredients and steps with no JavaScript, in one accent colour that only ever means done
- Cook time on every surface a recipe reaches — hero, cards, archive entries, ranked list, search, article header — and no read-time estimate anywhere
- A print sheet for recipes beside Share and Save: chrome removed, the picture sized to the paper, ingredients and method kept whole across page breaks, amounts printed at whatever scale the reader set
- A front page dealt from the archive with no repeats — an edge-to-edge featured recipe under a transparent header, a scrolling section rail, a dense grid of covers, a rail of half-hour recipes derived from their own cook times, the writing as dark cards, a row of round plates, a tinted band for repeat cooks, and a ranked chart beside the sweet section — with every block hiding itself when it has nothing to show
- A three-link masthead with a full-width Recipes panel showing every section on the cover of its newest recipe, a centred wordmark, and Search, Saved, and a focus-trapped drawer laid out as a contents page
- Four article openings set per post — standard, banner, cover, and immersive — sharing one title block
- Archive, section, tag, and author pages built from one entry component, as a four-across card grid or an image-led list, set per section
- A Filters dialog on the archive and section pages — section, time, and effort — working across the whole archive from the search index, with the state kept in the URL
- Client-side search with a keyboard palette and a results page, both reading one build-time index that covers ingredients as well as titles, ranked in tiers and matched on word starts
- Saved recipes: a per-browser reading list from any article, read back on its own page, with no accounts or backend
- Markdown content collections with a validated frontmatter schema, drafts excluded from every listing, feed, and index
- A feed for everything, one per section, and one per author, carrying full content, where a recipe's item opens with its yield, times, and ingredient list
- Sections, navigation, the recipe scale, the byline, and SEO defaults in four config files, so the site can be renamed and re-scoped without touching a component
- Provider-neutral newsletter and contact forms, pointed at any endpoint that accepts a POST, or left off
- Per-post share cards cropped from each cover at build time, plus canonical URLs, sitemap, RSS, robots.txt, Open Graph, Twitter and X cards, and JSON-LD for Recipe, Article, BreadcrumbList, and WebSite
- Dedicated about, contact, privacy, search, saved, and custom 404 pages
- Two self-hosted typefaces, Young Serif and Figtree, a white page with a spinach-green accent, one colour mode, and a radius scale that can be set to zero in one place
- Responsive Astro images with defined dimensions, optimized formats, and layout-stable media
- Accessible skip link, semantic landmarks, labelled controls, visible focus states, and one tab stop per archive entry
- CSS-only scroll-driven motion with a fallback, flattened under reduced-motion preferences
- Static Astro output with no hydrated framework islands, with JavaScript only for search, the drawer, the filters, the servings stepper, the units switch, and the progress bar
- Clean commercial template structure ready for customization and deployment
Best Used For
- Recipe blogs and cooking sites
- Weeknight and everyday cooking publications
- Baking and pastry sites
- Seasonal and vegetable-led food writing
- Kitchen essays and field notes
- Cookbook author and cooking-school sites
- Restaurant, farm, or produce-box journals
- Food photography portfolios that need working recipes
- Meal-planning and batch-cooking archives
- Food publishers who need fast static performance, recipe structured data, and a print-ready kitchen page
