Inicio Restaurant Bakery & Cafe Homepage

Bakery & Cafe Homepage

A warm, artisan bakery and cafe homepage with daily specials, online ordering, and cozy atmosphere

Homepage Bakery Cafe Online Ordering
Copia este prompt y pégalo en ChatGPT o Claude
Create a warm, inviting homepage for an artisan bakery and cafe called "Golden Crumb" located in a charming neighborhood storefront. The design should feel handcrafted, cozy, and slightly rustic-modern.

1. NAVIGATION BAR
- Logo: "Golden Crumb" in a hand-lettered serif font with a small wheat stalk illustration
- Links: Menu, Order Online, Catering, Our Story, Visit Us
- Right side: shopping bag icon with item count badge, "Order Pickup" button (#B45309 amber, solid)
- Transparent on hero, turns white with shadow on scroll
- Hamburger menu on mobile with full-screen overlay

2. HERO SECTION
- Full-width lifestyle photo of fresh croissants on a marble counter with flour dust and morning light
- Overlaid content (centered):
  - Tagline in script font: "Baked Fresh Every Morning"
  - Headline: "Artisan Breads, Pastries & Coffee"
  - Subheadline: "Made from scratch with organic flour, local butter, and a whole lot of love since 2018."
  - Two CTAs: "View Today's Menu" (solid #B45309 amber) and "Order for Pickup" (outlined white)
- Subtle Ken Burns zoom effect on the background image
- Bottom edge: decorative scallop border in cream (#FEF3C7)

3. TODAY'S SPECIALS (3 featured items)
- Section heading: "Fresh Out of the Oven" with a small clock icon and "Updated daily at 6 AM"
- 3 cards in a horizontal row:

- Special 1: "Sourdough Boule"
  - Photo: rustic round loaf with scored top
  - "Our 48-hour fermented sourdough with a crackling crust"
  - Price: $8.50
  - Tag: "Best Seller"
  - "Add to Order" button

- Special 2: "Almond Croissant"
  - Photo: golden croissant with sliced almonds and powdered sugar
  - "Twice-baked with house-made almond cream and toasted almonds"
  - Price: $5.75
  - Tag: "Staff Pick"
  - "Add to Order" button

- Special 3: "Lavender Honey Latte"
  - Photo: latte with beautiful foam art in a ceramic cup
  - "Local honey, dried lavender, and our house espresso blend"
  - Price: $6.25
  - Tag: "Seasonal"
  - "Add to Order" button

- Cards: cream background (#FFFBEB), 16px border-radius, subtle warm shadow
- Tags shown as small rounded badges above the photo

4. MENU OVERVIEW (tabbed sections)
- Tabs: Breads, Pastries, Breakfast, Lunch, Coffee & Drinks
- Default tab: Breads
- Grid layout (2 columns on desktop) showing 4-6 items per tab:

Breads tab example:
  - Sourdough Boule — $8.50
  - Multigrain Farmhouse Loaf — $9.00
  - Ciabatta — $6.50
  - Olive Rosemary Focaccia — $7.75
  - Rye Pumpernickel — $8.00
  - Baguette — $4.50

- Each item: small square photo (80px), name, one-line description, price, "Add" icon button
- "View Full Menu" button below with arrow
- Dietary icons where applicable: 🌱 vegan, 🌾 gluten-free option, 🥜 contains nuts

5. OUR STORY SECTION (2-column layout)
- Left: portrait photo of two bakers (husband and wife team) in aprons, smiling in the kitchen
- Right content:
  - Headline: "From Our Kitchen to Yours"
  - Story: "What started as a weekend farmers market stand in 2018 has grown into the neighborhood's favorite gathering spot. We're Elena and Marcus, and we believe great bread takes time — our sourdough starter is older than the shop. Every loaf, pastry, and cup of coffee is made with intention."
  - Signature graphic: "— Elena & Marcus"
  - CTA: "Read Our Full Story →" link
- Background: soft cream (#FEF3C7)

6. HOW ONLINE ORDERING WORKS (3 steps)
- Headline: "Order Ahead, Skip the Line"
- Step 1: "Browse Our Menu" — "Choose from today's fresh selection" — menu icon
- Step 2: "Pick Your Time" — "Select a pickup window that works for you" — clock icon
- Step 3: "Grab & Go" — "Your order, boxed and ready when you arrive" — bag icon
- Connected by a dashed line with brown circles
- CTA below: "Start Your Order" button

7. GALLERY SECTION (masonry grid)
- 6 photos in staggered layout:
  - Interior shot: exposed brick, wooden tables, hanging Edison bulbs
  - Close-up: flaky croissant being torn apart
  - Barista pouring latte art
  - Display case full of colorful pastries
  - Outdoor patio with flower boxes and bistro chairs
  - Bread loaves cooling on wire racks
- Hover: slight zoom with warm overlay and caption
- Lightbox on click
- Below gallery: Instagram handle "@goldencrumb" with "Follow us for daily bake updates"

8. CUSTOMER REVIEWS (horizontal carousel)
- Review 1: "The best sourdough in the city. We drive 30 minutes just for their bread." — Jake & Amy R. ★★★★★ Google
- Review 2: "Their almond croissant changed my life. Not exaggerating." — Nadia K. ★★★★★ Yelp
- Review 3: "Cozy atmosphere, amazing coffee, and the breakfast sandwich is perfection." — Tom W. ★★★★★ Google
- Review 4: "We order their bread box subscription weekly. Never disappoints." — Lisa M. ★★★★★ Google
- Auto-advance every 5 seconds, dot navigation, pause on hover
- Warm background (#FEF3C7)

9. CATERING & EVENTS PROMO (split section)
- Left side content:
  - Headline: "Catering for Every Occasion"
  - "From office breakfast spreads to wedding dessert tables, we craft custom menus for groups of 10 to 200."
  - 3 bullet points with icons:
    - "Pastry & bread platters for corporate meetings"
    - "Custom wedding and celebration cakes"
    - "Weekly office bread box subscriptions"
  - CTA: "Request a Catering Quote" button
- Right side: photo of a beautifully arranged pastry platter on a wooden board

10. BREAD SUBSCRIPTION BOX (promotional section)
- Headline: "The Weekly Bread Box"
- Description: "Get a curated selection of our freshest breads and one surprise pastry delivered to your door every Saturday."
- Pricing: "$32/week — Free delivery within 5 miles"
- What's included: "2 loaves of bread + 1 specialty pastry + tasting notes"
- CTA: "Subscribe Now" button
- Illustration or photo of an open box with bread wrapped in kraft paper
- Badge: "🎁 Perfect gift — Gift subscriptions available"

11. VISIT US SECTION
- Two-column layout: map embed on left, details on right
- Address: "247 Elm Street, Maplewood Village"
- Hours:
  - Tue–Fri: 7:00 AM – 4:00 PM
  - Saturday: 7:00 AM – 3:00 PM
  - Sunday: 8:00 AM – 2:00 PM (pastries & coffee only)
  - Monday: Closed (baking day!)
- Phone: (555) 847-2200
- Parking: "Free street parking + lot behind the building"
- Special note: "🐕 Dog-friendly patio seating available"

12. NEWSLETTER & FOOTER
- Newsletter strip: "Join the Crumb Club" — "Get early access to seasonal specials, baking tips, and a 10% off coupon for your first online order."
- Email input + "Join" button
- Footer: 3 columns — Menu, Company, Connect
- Social icons: Instagram, Facebook, TikTok
- Payment icons: Visa, Mastercard, Apple Pay, Google Pay
- Small text: "© 2026 Golden Crumb Bakery & Cafe. Made with flour, butter, and love."

Design: Warm, artisan, rustic-modern. Primary: #B45309 (warm amber), secondary: #92400E (deep brown), cream background: #FFFBEB, card surfaces: #FEF3C7, body text: #451A03. Typography: Playfair Display for headings (serif, elegant), Inter for body text, and a script font (e.g., Dancing Script) for taglines. Cards with 16px border-radius and soft warm shadows. Paper-like texture on section backgrounds where appropriate.

Responsive: On mobile, all grids stack to single column. Menu tabs become horizontal scrollable pills. Gallery switches to 2-column grid. Carousel shows one review at a time with swipe. Navigation collapses to hamburger. Sticky bottom bar with "Order Now" CTA on mobile.

Cómo usar este prompt

  1. 1 Copia el prompt de arriba
  2. 2 Pégalo en tu herramienta de IA favorita (ChatGPT, Claude, v0, etc.)
  3. 3 La IA generará el código del sitio web por ti
  4. 4 Personaliza e itera según tus necesidades

Acerca de este Prompt de Restaurant

Este prompt Bakery & Cafe Homepage está diseñado para ayudarte a crear rápidamente sitios web profesionales de restaurant usando herramientas de IA como ChatGPT, Claude, v0 de Vercel, Cursor y Bolt.new.

Ya seas desarrollador, diseñador o emprendedor, este prompt de IA gratuito te da una ventaja al crear bakery & cafe homepage. Simplemente copia el prompt, pégalo en tu asistente de código IA favorito y personalízalo para tu marca.

Herramientas de IA Compatibles

  • ChatGPT (GPT-4) - Excelente para generación detallada de código y explicaciones
  • Claude 3 - Excelente para diseños web complejos y matizados
  • v0 de Vercel - Perfecto para componentes React y Next.js
  • Cursor - Ideal para codificación potenciada por IA en tu IDE
  • Bolt.new - Prototipado rápido y apps full-stack
  • Lovable - Constructor de sitios web IA fácil de usar

Etiquetas

Homepage Bakery Cafe Online Ordering Restaurant Prompt de IA Plantilla Gratis Constructor Web Diseño Web Prompt Copiar Pegar