Oishii is a modern astro website theme built for Japanese restaurants, sushi bars, ramen shops, and izakayas. It ships as a complete, production-ready site: a homepage that sells the room, a full menu, a photo gallery, a reservation flow, a private-dining enquiry page, a blog, and all the legal pages a real business needs. Because it is built on Astro, every page is pre-rendered to static HTML — there is no framework shipped to the browser for content, which means pages load fast, score well on Core Web Vitals, and stay cheap to host anywhere. It suits restaurant owners, hospitality agencies, and freelance developers building for food clients who need something polished on day one and easy to maintain on day one hundred.
🎨 Design & Purpose
Oishii uses a dark, restaurant-at-night palette built on three custom Tailwind color scales: a vermilion brand orange-red for actions, a gold accent that carries the Japanese character of the design, and a deep neutral ink range for surfaces and type. The accent is used with restraint — gold for badges, prices and dividers, red reserved for the handful of things you actually want guests to click. Typography pairs Zen Kaku Gothic New for headings with Inter for body text, so Japanese and Latin characters sit together without looking mismatched. Every foreground and background pairing was checked against WCAG AA contrast, which matters more than it sounds on a dark theme.
The layout itself is deliberately unusual for the category: a fixed left sidebar on desktop that turns into an off-canvas drawer on mobile, which keeps the menu, hours, and reservation button permanently within reach instead of hidden behind a hamburger. It was built to answer the things restaurant sites usually get wrong — a menu that is painful to update, photos that open in an ugly new tab, a reservation form nobody completes on a phone, and a blog that was bolted on as an afterthought.
✨ What Makes This Theme Different
- 🗂️ Content lives outside your markup. Menu items, dishes, testimonials, opening hours and gallery images are typed TypeScript . Change a price in one place and it updates everywhere it appears.
- 🧩 Pages are composed from data, not copy-paste. A page's frontmatter lists which sections render and in what order — rearrange a page by editing one line.
- 📝 A blog that is actually a blog. MDX posts with categories, tags, authors, read time, and automatic pagination that appears only when you have enough posts.
- 🧱 One shell, not fourteen copies. Sidebar, header and footer exist once. Active navigation state is derived from the URL, including nested dropdown items.
- 🖼️ Two separate lightbox galleries. Dish photos and venue photos never mix when a visitor clicks through them.
- 📅 A date picker guests will use. Flatpickr, fully restyled to the dark theme rather than dropped in with its default white calendar.
- 🏷️ Labelled components throughout. Every block is named in the markup, so handing the project to another developer takes minutes.
🧬 Design DNA
- 🏮 The izakaya at night — warm light pooled on tables, dark walls, and a red lantern as the one bright point
- ⛩️ Vermilion torii gates — the single saturated red used sparingly against muted surroundings
- 🪟 Shoji screen geometry — the nested-square pattern tiling the footer and testimonial backgrounds
- 🥇 Kintsugi gold — a thin precious line used to mark, divide and draw attention
- 🔪 The sushi counter — an unobstructed view of the thing that matters, with everything else kept out of the way
- 🗻 Hand-drawn Japanese motifs — lantern, umbrella and Fuji doodles that appear only on wide screens, where there is room to breathe
📄 Pages Included
- 🏠 Home Nine composed sections: hero, intro, signature dishes, why-us, menu, story, gallery, testimonials, CTA
- 🍱 Menu Full dish list driven entirely by your data file, with image lightbox
- 📖 About MDX story page with appended feature and gallery sections
- 🖼️ Gallery Photo grid with full-screen lightbox and captions
- 📅 Reservations Booking form with a themed date picker and an hours panel
- 🥂 Private Dining & Events Intro, three venue spaces, and an event enquiry form
- 🎏 Specials & Events Seasonal offers page driven by its own data file
- 🛍️ Order Online Three-step takeout explainer plus travel-friendly dishes
- 📰 Blog Paginated post grid, six per page
- 📝 Blog Detail Article layout with author card, tags, related posts and a CTA
- ✉️ Contact Contact form alongside location, phone and hours
- 🔒 Privacy Policy Long-form MDX page, ready to edit
- 📜 Terms of Service Long-form MDX page, ready to edit
- 🚧 404 On-brand not-found page
🛠️ Tech Stack
- ⚡ Astro 7.4 — static site generation, zero JavaScript shipped by default
- 📄 MDX blog posts and narrative pages
- 🎨 Tailwind CSS 4 — configured no PostCSS config needed
- 🏔️ Alpine.js 3 — sidebar drawer, dropdown and collapsible sections, declared in the markup
- 💡 GLightbox — image lightbox, restyled to the theme
- 📆 Flatpickr — date selection, restyled to the theme
- 🔤 Bootstrap Icons — a single consistent icon set
- ✍️ Google Fonts — Zen Kaku Gothic New and Inter
- 🧪 TypeScript — strict mode, path aliases, and passing with zero errors
- 🗺️ @astrojs/sitemap — sitemap generated on every build
💌 Free Updates & Support
Every purchase includes free lifetime updates — bug fixes, dependency bumps, and compatibility with future Astro releases arrive at no extra cost. The theme is documented in detail in its readme.md, covering the content collections, the section registry, the color system, and the cascade reasoning behind the vendor style overrides, so most questions are answered before you need to ask.
