Sobremesa — Retro Supper Club Landing Page Template

Quick summary

Sobremesa is a single-page, click-through landing page template designed for intimate Spanish supper clubs. It opens with a handheld video hero, moves through a staggered masonry grid of food photography and guest quotes, and closes with a full-width "Claim Your Seat" block. Every design decision serves one goal: make the visitor hungry for a table they have not yet sat at.

Who this template is for

This template is built for operators who understand that a great supper club sells feeling before it sells food. It fits anyone launching or running a curated, ticket-based dining experience where exclusivity and community are the core appeal. Supper clubs rely on those two things above everything else to attract and retain guests.

• Independent supper club hosts and pop-up dining operators who want a visually rich, conversion-focused landing page without starting from scratch.
• Restaurant teams or private chefs planning a series of ticketed dinner events and needing a standalone promotional page.
• Experience-focused food entrepreneurs who collect and sell memorable evenings rather than standard à la carte meals.

What problem this template solves

Most restaurant and dining pages look like menus. They list dishes, state prices, and leave the visitor cold. A supper club is not a restaurant in the conventional sense. It is a curated social event where the meal and the people around the table are equally important. A generic page cannot communicate that.

• Visitors bounce because they cannot feel the atmosphere before they arrive. This template uses video, parallax photography, and pull-quotes to close that gap.
• Hosts lose bookings because their call-to-action is buried. The persistent bottom bar and three strategically placed "Claim Your Seat" triggers keep the next step visible at every scroll point.
• Generic dining pages ignore the emotional story behind the cooking. This template gives that story a dedicated visual language from the first frame of video to the final closing block.

What you get with this template

You get a fully structured, single-page layout that is ready to customize with your own video footage, food photos, event details, and guest quotes. Every section is already in place. You do not need to plan the page architecture; it is done.

• A full-screen video hero with an ambient overlay and headline text, plus a masonry grid section with parallax card behavior, a next-supper full-width announcement card, a guest voices pull-quote section, a closing call-to-action block, and a minimal footer.
• A four-color design system built from deep ink, warm cream, smoked cedar, and persimmon accent, applied consistently across backgrounds, text, and interactive elements.
• Three instances of the primary "Claim Your Seat" call-to-action placed as a persistent bottom bar, an in-grid persimmon button, and a full-width closing block.

Feature list

This template ships with a specific set of design and layout features drawn directly from the project brief. Each one is intentional and contributes to the overall sensory experience.

Full-Screen Video Hero with Ambient Overlay

The header is a full-screen video background filmed handheld with a shallow depth of field and warm tungsten lighting. The camera drifts across a table mid-feast: bread dragged through romesco, wine catching candlelight, a cast-iron pan of paella still crackling. A single cream headline breathes in over the footage. The hero section places a captivating headline and the primary call-to-action in view without scrolling, which is exactly where both need to be.

Masonry Grid with Parallax Cards

Past the video, a staggered masonry grid arranges food photography alongside hand-lettered menu fragments and short guest pull-quotes. Each card carries a subtle parallax drift as the visitor scrolls. The rhythm follows a deliberate image-text-image-image-text sequence so the eye never fully settles, mimicking the restlessness of a table where plates keep arriving. Ingredient close-ups are tight enough to show salt crystals on jamón.

Persistent Call-to-Action System

The "Claim Your Seat" trigger appears three times across the page. It first appears as a persistent bottom bar after the hero video ends. It then appears as a persimmon button on the next-supper announcement card. It appears a final time as a full-width closing block. There is no form on this page. Every click carries the visitor directly to a separate booking flow.

Next Supper Announcement Card

A full-width card breaks the masonry grid at the midpoint. It shows a black-and-white overhead photograph of an empty table set for twelve, captioned with the date and neighborhood of the next event. This single card does more conversion work than most dedicated sections because it makes the event feel real, specific, and close.

Guest Voices Pull-Quote Section

An editorial pull-quote section renders guest testimonials in cedar and cream contrast. Short, personal quotes sit large on the page. Incorporating real guest voices enhances credibility and encourages bookings far more effectively than any description of the food could. The section is built to receive your own quotes without structural changes.

Neo-Retro Color and Typography System

The design applies a four-token color system: deep sumi ink (#1A1A2E), warm shoji screen cream (#F5F0E8), smoked cedar (#6B5B4E), and persimmon (#C1553D). Persimmon is reserved exclusively for buttons and hover states. The palette references 1970s Madrid bodega aesthetics filtered through Japanese film stock: muted, grain-heavy, deliberately imperfect. Typography and spacing follow the neo-retro principle of blending mid-century layout logic with contemporary web proportions.

Page sections overview

Design & branding system

The visual identity is built on an unlikely but effective pairing: the warmth of 1970s Spanish bodega culture and the restraint of a Japanese Zen color philosophy. For a Spanish theme, a palette should start with warm whites, terracotta, and ochre tones combined with vibrant accent colors, and this template does exactly that in a more refined, grain-heavy register. The result feels like a photograph taken on slow, warm film stock in a candlelit room.

• Four-color token system: ink (#1A1A2E) for dark backgrounds, cream (#F5F0E8) for light sections, cedar (#6B5B4E) for body text and secondary surfaces, and persimmon (#C1553D) used only on buttons and hover states.
• Backgrounds alternate between ink and cream across sections, maintaining visual rhythm without introducing new colors. Text lives in cedar. Persimmon appears only where a finger should press.
• Typography and spacing follow neo-retro principles: mid-century modern layout logic combined with contemporary proportions and kinetic headline treatment on the hero, where the cream text breathes in over the video footage.

Mobile & speed optimization

This template is designed with a mobile-first approach. Many visitors will encounter the supper club page on a phone, often through a social share or a story link, and the booking decision will happen in that moment. A mobile-first design is necessary to ensure the page functions well on phones when users are ready to commit.

• The masonry grid reflows cleanly for narrower viewports. Card proportions, parallax behavior, and text sizing are all adapted for touch-based scrolling.
• The persistent bottom call-to-action bar is particularly effective on mobile, keeping the booking trigger visible without interrupting the scroll experience.
• The full-screen video hero is optimized for autoplay behavior on mobile browsers, with the ambient overlay and headline remaining legible at all screen sizes.

How this template helps you convert

The page is engineered around a single conversion action: clicking through to reserve a seat. Every section earns that click before asking for it. The template makes visitors hungry first, then gives them a clear and low-friction path forward.

1. The video hero creates immediate atmosphere and emotional investment. The viewer sees hands tearing bread, wine moving in a glass, and a pan of paella mid-crackle before they read a single word. By the time the headline appears, they are already at the table in their imagination.
2. The masonry grid sustains and deepens that appetite. Guest pull-quotes add social proof and a sense of community. The next-supper card makes the event specific and real with a date and a city neighborhood. At that point the visitor is not browsing; they are deciding.
3. The closing full-width block removes any remaining hesitation by presenting "Claim Your Seat" in its most direct form. Three call-to-action placements mean the path to booking is never more than a glance away, regardless of where on the page the visitor currently stands.

Other information about this template

This template draws on a deep tradition of Spanish food culture and the concept that a meal is as much about connection as it is about nourishment. Sobremesa, the cultural tradition that originated in Spain and became deeply ingrained in places like Mexico, refers to the time people spend talking, laughing, and lingering at the table once the eating is done. In Mexico City, sobremesa can easily double or triple the length of a dinner. Restaurants in Mexico City are known for accommodating this practice by allowing guests to linger without pressure. The template is named after that tradition because the page itself is designed to keep visitors at the table a little longer than they expected to stay.

Spanish cuisine is a vibrant tapestry shaped by centuries of cultural exchange. The Mediterranean diet forms the foundation, with olive oil, garlic, and tomato featuring prominently across regions. Olive oil appears in nearly every corner of Spanish cooking, from drizzling over bread to finishing seafood dishes, crisping potatoes, and enriching slow cooked stews. The Moorish occupation from 711 to 1492 introduced rice, almonds, and spices that still shape iconic dishes today. Regional pride runs deep: the Basque Country is celebrated for its pintxos culture and its elevated approach to fish and meats, while Valencia gave the world paella. Recipes from across Spain reflect decades of layering local produce, seasonal vegetables, fresh seafood, olives, and quality meats into complex, delicious plates.

The template is suited to operators who want to honor those culinary traditions visually without relying on a generic restaurant page format. The design ideas embedded in the brief reflect how food in Spain and the broader Mediterranean world is experienced: as a relaxed, communal, multi-course event where conversation flows as freely as wine. Travelers who seek out supper clubs in any city are often chasing exactly that feeling, whether they find it in a Barcelona bodega or a pop-up in Mexico City.

The sobremesa neo retro spanish supper club landing page template is particularly well suited to operators who have strong food photography already in hand. The masonry grid is built to show that photography at its best. Operators who store their best shots and want a frame worthy of them will find the layout does the curation work automatically.

• The template references nostalgic 1960s-70s Spanish aesthetics blended with modern, mobile-optimized web layout logic.
• The neo-retro style modernizes mid-century and early 80s design conventions for contemporary web use, including kinetic headline behavior on the hero.
• The brand story section embedded in the next-supper card provides space for history and regional context about the cooking style or chef background.
• Warm, earthy colors such as olive green tones, deep ink, and the persimmon accent align with the broader principle that a Spanish supper club palette should feel bold and grounded simultaneously.
• The template can support a team of contributors: one person managing event details, another handling photography, and a third updating the guest voices section independently.
• Global influences from the Mediterranean world and beyond have shaped Spanish food culture over decades, and this template gives those influences room to breathe visually.

Show more