Back to templates

Template details

Larkin

A free Astro + Tailwind CSS 4 café site template covering menu, locations, open/closed hours, and legal pages.

About this template

Larkin is a free café website template built with Astro, Tailwind CSS 4, and TypeScript that organizes a coffee shop's site around the four questions visitors actually check: where, when, what, and can I work here.

What is Larkin?

Larkin is a static café website template for Astro that renders every page on the server and ships only two small browser scripts (public/hours-today.js and public/menu-close.js), so the site keeps working with JavaScript disabled. Content comes from local files — markdown in src/content/ for menu items and one file per shop in src/content/locations/, business details in src/data/business.json, and translatable strings in src/i18n/en.json — and the build outputs a deployable dist/ folder. It is published by Alder Themes under a license that allows unlimited use including client work, but forbids republishing it as a template.

Key Features

  • Astro + Tailwind CSS 4 + TypeScript stack — no framework JavaScript; each page is server-rendered and functional without JS.
  • Menu content collection — one markdown file per menu item under src/content/, rendered into menu pages with a small close script.
  • Location pages — one file per shop in src/content/locations/, holding addresses and opening hours.
  • Open/closed state — a hours-today.js script reports today's opening status from the location data.
  • Built-in editor with GitHub OAuth login — an /admin route lets a client sign in and edit menu items, backed by a separate login service with GitHub OAuth keys.
  • i18n — English and Turkish strings ship in src/i18n/en.json; the active language switches via locale in src/data/site.json.
  • Theming — colors and fonts are set in the :root block of src/styles/global.css.
  • Deploy-ready config — Cloudflare wrangler.jsonc is included and a SITE environment variable sets your domain without editing astro.config.mjs.

Who is it for?

  • Café and coffee shop owners: launch a site where customers find the address, opening hours, menu, and workspace-friendly details.
  • Freelancers and agencies building client sites: follow the ten-step launch order from local install through GitHub repo, deploy, login service, OAuth app, and handing the client an editor login.
  • Developers who want a no-JS static build: start from an Astro template with simple file-based content editing and Tailwind styling.

What can you do with Larkin?

  • Hand a client menu editing: deploy the login service, create a GitHub OAuth app, and let the owner sign in at /admin to change a menu item without touching code.
  • Run a multi-location shop: add a markdown file per location to publish separate addresses and opening hours.
  • Localize for another market: switch the locale to Turkish or edit the string file for another language.

How does Larkin work?

Install with npm install and run npm run dev on Node 22.19.0 or newer, or use npm ci on a build server because package-lock.json pins the tested dependency tree. Set SITE to your domain, run npm run build to produce dist/, and deploy that folder; the docs walk through all ten launch steps in order.

Pricing

Larkin is free to use in unlimited projects, including client work; it cannot be republished as a template. Demo photography is AI-generated and covered by a separate image license.

Screenshot of Larkin