Restaurant Hero - Cinematic Appetite Template

A homepage hero for restaurants that sell atmosphere before they sell a menu. Four wide panes of near-black warmth, candlelight-cream Fraunces 900, and a brass accent reserved for the booking pill and the micro-meta. The fictional EMBER & SALT carries it: slow-motion embers burn under the name, a charred tasting-menu plate lands inside giant serif type, a crudo dish completes the phrase "RAW / HONEST", and a candlelit dining room closes with two words - "TONIGHT, THEN." Export it as clean HTML, React, Vue, or Svelte code and it drops into an existing site as the hero section.

#What Makes This Template Stand Out

The cover opens with fire, not a photo of a plate. A full-bleed background video of glowing embers and open flame burns behind "EMBER & SALT" in lower-third Fraunces, with the three-word line "Fire. Smoke. Patience." beneath and the brass "BOOK A TABLE" pill bottom-right. A still ember photograph with a slow zoom sits under the video as a fallback, so the pane degrades gracefully on any connection. The pane holds longer than the others - the template breathes at a 6-second pace because appetite is not in a hurry.

Dishes land inside the typography instead of next to it. Pane 2 stacks "SEVEN / COURSES" at display scale and drops a background-removed cutout of the charred-beef tasting plate onto the end of the headline, entering with weight - plates land, they do not float. Pane 3 runs the sandwich the other way: "RAW" on the left, a citrus-dressed crudo plate dead center, "HONEST" on the right, reading as one phrase through the food. One quiet line below - "Everything from within 40 miles." - does the sourcing talk.

The close is a reservation, phrased like a person. A moody candlelit dining room - brass lamps, set tables, glassware catching the light - fills the final pane under a heavy bottom gradient, with "TONIGHT, THEN." centered in Fraunces and the booking pill directly beneath it. The room's darkness fades naturally back into the cover's flames, so the loop seam disappears and the hero runs continuously without a visible restart.

• Open-flame background video cover with a ken-burns still fallback underneath
• Candlelight-cream Fraunces 900 serif on near-black warm field with brass accents
• Dish cutouts that land with weight inside the headlines - SEVEN COURSES and RAW / HONEST
• Sensory three-word voice: "Fire. Smoke. Patience." and a 40-mile sourcing line
• Closing dining-room pane with "TONIGHT, THEN." and a persistent Book a table pill
• 4-pane 2:1 hero that exports to HTML, React, Vue, or Svelte and drops into any site

#Who Should Use This Template

• Fine-dining and tasting-menu restaurants whose website's only real job is converting atmosphere into reservations. The four panes run that funnel - mood, menu, philosophy, booking - without a paragraph of copy.
• Chef-led and concept restaurants with a strong point of view. The sensory voice and the dish-inside-type composition give a kitchen's identity the same production grade as its plating.
• Hospitality groups and agencies building sites for restaurant clients. One template skins to any venue with four photo swaps and a name change, and exports as code their developers can mount anywhere.
• Bars, wine rooms, and supper clubs that trade on evening atmosphere. The candlelit palette and slow pacing fit any venue where the lights are low on purpose.

#Best Use Cases

#Restaurant Homepage Hero

The native use. Export to HTML, React, Vue, or Svelte and mount it as the full-width band above the menu and hours. The autoplay walks a visitor from flame to signature dish to sourcing to booking before they scroll, and the brass pill points at OpenTable, Resy, SevenRooms, or your own reservation form on every pane.

#Tasting Menu or Seasonal Launch

When the menu changes, the hero changes with it: a new dish cutout on pane 2, a new course count, a new sourcing line. The structure keeps each seasonal launch consistent while the food stays the star. Publish the PaneFlow link directly as a teaser page while the full menu PDF is still at the printer.

#Social Teasers and In-Window Screens

The same project exports to video, turning the hero into a 25-second cut for Instagram or a looping screen in the restaurant's window. Slow embers and a serif name read from across a feed or a sidewalk equally well, and the dish-landing animation gives the cut its one moment of drama without any video production.

#How to Customize This Template

1. Open PaneFlow and select "Restaurant Hero - Cinematic Appetite" from the template gallery
2. Replace "EMBER & SALT" on the cover with your restaurant name and rewrite "Fire. Smoke. Patience." in your own three-word register
3. Swap the cover's ember video for your own atmosphere clip (or delete it and keep the zooming still underneath)
4. Update pane 2: edit "SEVEN / COURSES" and the "TASTING MENU · THU-SAT" micro-meta, and replace the dish cutout with a background-removed shot of your signature plate
5. Rewrite pane 3's "RAW / HONEST" word pair, swap the center crudo cutout, and update the "Everything from within 40 miles." sourcing line
6. Replace the closing dining-room photo with your own room and keep the heavy bottom gradient for legibility
7. Point every "Book a table" pill at your reservation system
8. Export to HTML, React, Vue, or Svelte for the site hero, or to video for social and in-venue screens

#Related Templates

• Restaurant Menu Tabs - an interactive dark menu to sit one click behind this hero
• Restaurant Menu Editorial - the long-form menu treatment in the same elegant register
• Travel Hero - Destination Slides - the same full-bleed cinematic hero logic aimed at places instead of plates
• Luxury Product Hero - Dark Spotlight - near-black theatre and a single hero object, for products

#Related Resources

• PaneFlow for Landing Pages - animated hero sections that export as clean code
• PaneFlow for Marketers - campaign-grade visuals for launches and seasonal pushes
• PaneFlow for Webflow - embedding exported PaneFlow heroes in Webflow sites