Ombra

Ombra is a dark, editorial Astro theme designed for intimate restaurants, tasting counters, supper clubs, chefs, and hospitality concepts that need a fast one-page presence with strong imagery and polished SEO defaults. The theme runs on Astro 7.x and TypeScript, produces fully static pages with no client-side framework runtime, and is released under the MIT License by Andrei Alba.

What is Ombra?

Ombra is a dark, editorial one-page Astro theme for intimate restaurants, tasting counters, supper clubs, and hospitality concepts. It takes typed configuration files (site metadata, homepage content) and local imagery as input, and produces a static, SEO-ready site with no client-side JavaScript framework at runtime. The theme is built on Astro 7.x, written in TypeScript, and released under the MIT License.

Key Features

• Static output with zero client runtime — Pages are pre-rendered as plain HTML by Astro; no client framework like React or Vue is loaded on the visitor's browser.
• Typed site configuration — src/config/site.ts holds site metadata, navigation, address, hours, social links, reservation settings, and animation controls.
• Typed homepage content — src/config/home.ts defines homepage copy, menu courses, chef timeline, interior notes, and footer text.
• Complete SEO metadata — Every page gets canonical URLs, Open Graph tags, Twitter card tags, and Restaurant JSON-LD structured data.
• Sitemap and robots.txt — Sitemap integration is included, and a production robots.txt is generated automatically.
• Self-hosted local fonts — Fonts are served from the theme with only the weights the design uses; no external font CDN requests.
• Accessibility built in — Semantic sections, a skip link, visible focus styles, labelled reservation form controls, and keyboard-accessible mobile navigation without extra JavaScript.
• Optional reveal animations — Scroll-triggered reveals are controlled from site config and respect the prefers-reduced-motion setting.
• Responsive editorial layout — The single-page layout adapts to mobile and desktop with reduced-motion support.

Who is it for?

• Restaurant owners — Set up a one-page site with menu, hours, address, and a reservation request link without managing a CMS or backend.
• Chefs and tasting-counter operators — Present a chef timeline and tasting-menu courses in an editorial layout that keeps the focus on photography.
• Supper club hosts — Launch a temporary or small-scale presence with booking details and social links quickly.
• Hospitality web designers — Use the typed config files and base components as a starting point to build custom one-page sites for clients.

What can you do with Ombra?

• Launch a one-page restaurant site — Replace the placeholder copy and images in src/config/home.ts and src/assets, then build the static site for Vercel, Netlify, Cloudflare Pages, or GitHub Pages.
• Add SEO structure — The theme outputs canonical URLs, Open Graph and Twitter cards, and Restaurant JSON-LD automatically from the site config.
• Set up a reservation workflow — The default reservation form opens a mailto: link so it works without a backend; swap the form action for a booking provider, endpoint, or server action in production.

How does Ombra work?

1. Click "Use this template" on GitHub and clone the generated repository.
2. Run npm install and npm run dev to preview locally at http://localhost:4321.
3. Edit astro.config.mjs to set the production URL, then customize src/config/site.ts and src/config/home.ts.
4. Replace images in src/assets and the social preview image at public/og.png.
5. Run npm run check, npm run build, and npm run preview to produce and test the static build before deploying.

Pricing

Ombra is free: the theme is published under the MIT License, so you can use, modify, and deploy it without a license fee.

FAQ

Is Ombra free to use?

Yes, Ombra is released under the MIT License, so it is free to use for personal and commercial projects. You can modify the theme and include it in client work, as long as the copyright notice is preserved.

Does Ombra require a backend or CMS?

No. Ombra is static Astro pages with no client framework runtime. The reservation form defaults to a mailto: link, and you can replace it with a form endpoint or booking provider for production use.

How do I change the restaurant's hours, menu, and reservation settings?

Edit src/config/site.ts for site metadata, navigation, address, hours, social links, reservation settings, and animation settings. Edit src/config/home.ts for homepage copy, menu courses, chef timeline, interior notes, and footer text.

Can I deploy Ombra to Vercel or Netlify?

Yes. Ombra produces static output and can be deployed to Vercel, Netlify, Cloudflare Pages, GitHub Pages, or any static host. Update the site value in astro.config.mjs to your final domain before building.