Most restaurant websites are the same scrollable brochure — a hero photo, a PDF menu, a contact form. NOIRÉ isn't that. It's built like a dining experience in the dark: every scroll unfolds a new scene, every dish is revealed course by course, and by the time a visitor reaches the reservation button they already feel like they've been seated.

Live demo: https://noire-
dining.netlify.app/

The template centers on five signature sequences. Dish Reveal transforms a single plate into a five-stage cinematic story — Ingredient → Preparation → Plating → The Dish → The First Bite — driven by scroll. Fourteen Seats is an interactive seating motif where 14 markers animate in and reveal a piece of the dining experience on hover or tap. Darkness Mode is a pinned, scroll-driven journey through five scenes of an evening, from Arrival to the Final Course, that progressively darkens the screen as the night deepens. The Interactive Tasting Menu steps guests through a full five-course sequence — Amuse, First, Second, Main, Dessert — each with its dish, ingredients, and wine pairing. And Dish Anatomy opens every individual dish in the same sequential, Michelin-menu style: Dish → Ingredients → Composition → Wine Pairing.

Every one of these is driven by plain, typed data files under src/data/ — there's no CMS, no database, and no backend to wire up. Renaming the restaurant, rewriting the menu, adding a new dish, swapping photos and videos, or changing the color palette and fonts is a matter of editing a TypeScript object, not touching component code. The contact and reservation forms are fully built and validated client-side, ready to be connected to a real backend or booking provider when you launch. A full Customer Guide walks through branding, content, images, video, navigation, SEO, and deployment step by step, so this is comfortably usable even by a non-developer maintaining the site day to day.

Built on Next.js 16 (App Router) with TypeScript, Tailwind CSS v4, Framer Motion, GSAP/ScrollTrigger, Lenis smooth scroll, React Hook Form + Zod, and Lucide icons. What you get: the full source code, every route (home, menu, dish detail, experience, story, journal + article detail, reservations, contact), responsive layouts tested down to 320px, images served through next/image (automatic AVIF/WebP, lazy loading), reduced-motion fallbacks for every animated sequence, SEO metadata with Open Graph/Twitter cards and JSON-LD restaurant structured data, an auto-generated sitemap and robots file, and a written Customer Guide covering installation, customization, and deployment to Netlify or Vercel.