A 22-page HTML template for restaurants, cafés and bars, with a different WebGL hero on each of its three homepages: drifting embers for fine dining, a swirling glass for a cocktail bar, and steam and coffee beans for a café.

It's built on Bootstrap 5.3 with plain JavaScript. The pages work straight from the folder and on any host, with no build step. Five colour palettes, each with a dark and a light mode, switch with one click. All 10 colour sets are checked for WCAG 2.1 AA contrast.

Pages included (22)

• 3 homepages: fine dining, cocktail bar, café and brunch
• Food and drink: menu with tabs and a dietary filter, single dish
• Bookings: reservations, private dining and events
• About: our story, chefs and team, gallery with lightbox, locations and opening hours
• Journal: blog list, article with comments
• Other: contact, FAQ, gift cards, 404, coming soon, credits
• Reference pages: style guide, right-to-left demo, 3D demo

Features

• 3 WebGL hero scenes built with Three.js. Each device gets a full, lite or static tier automatically, and the hero shows its artwork first, so the 3D never delays the page.
• 5 palettes, each in dark and light mode, with a palette switcher and a dark/light toggle
• Right-to-left stylesheet included
• Every JavaScript text string in one translation file
• Cookie notice with a consent event for loading analytics
• Smooth scrolling, scroll reveals, split headings, tilt cards and magnetic buttons. They respect "reduce motion", and the page works without them.
• Reservation form with opening-day rules, an event enquiry form, a gift card designer with live preview, and a coming-soon countdown
• Accessible: skip link, landmarks, visible focus, and keyboard-friendly menus, tabs, accordions, sliders and lightbox
• Responsive from 360 px phones to 1920 px screens
• Valid HTML5, BEM class names, and every design value as a CSS custom property
• Markup follows WordPress conventions (menu, widget, comment and Contact Form 7 classes)
• Self-hosted fonts and inline SVG icons, with no external requests

Technical

• Bootstrap 5.3.8 (Sass source included)
• Plain JavaScript, no jQuery
• Three.js r187, GSAP 3.15 (ScrollTrigger, SplitText), Lenis 1.3
• Sass and JavaScript source with optional npm build scripts (Node.js 18 or later)
• Contrast checker script for your own colours

What's in the download

• HTML/: all 22 pages, CSS (normal, minified and right-to-left), JavaScript and fonts
• Source/: Sass, JavaScript, page templates and build tools
• Documentation/: offline HTML documentation
• Licensing/: credits for every library, font and icon, with a copy of each third-party licence

Please note

• The demo photos are not included. The photos in the live preview are for demonstration only. The download uses placeholders at the same sizes. The credits page links to each photo on Pexels or Pixabay so you can get it from its source.
• The forms are front-end demos. They check what's typed and show a message. To receive submissions, connect them to your own form service or server script; the documentation shows how.
• The restaurant name, people, reviews and figures in the demo are fictional sample content.

Third-party components

• Bootstrap: MIT License
• Three.js: MIT License
• GSAP, ScrollTrigger and SplitText: GSAP Standard "No Charge" License, https://gsap.com/standard-license
• Lenis: MIT License
• Phosphor Icons: MIT License
• Fraunces and Manrope fonts: SIL Open Font License 1.1
• Demo photos: Pexels and Pixabay (not included in the download)

Licence and support

This item is licensed under the Wrapmarket License Terms: https://wrapmarket.com/help/licenses

Support is provided under the Wrapmarket Support Policy: https://wrapmarket.com/help/support-policy

Changelog

1.0.0: first release.