Skip to content
๐Ÿ”ฅ Special Launch Offer: Get lifetime access to all 24 prompts!Claim Discount
Restaurant

Coffee shop brand site

Warm light coffee roaster site with an oversized typographic hero and a hairline-separated list of coffee origins.

The prompt

Build a website for a single-location specialty coffee roaster called Meridian. Constraint: only three photographs exist. The design must not need more.

Structure: a hero that is pure typography โ€” the roaster name set enormous at clamp(3.5rem, 12vw, 9rem) filling the width edge to edge, with a single line beneath stating the city and the year founded in monospace. No image at all in the hero.

Then a horizontal band with the first photograph at 21:9 bleeding full width. Then 'What we roast': three coffee entries, each a row with an origin name, a monospace tasting-note list, an altitude and a price. Rows separated by hairlines, no images. Then the second photograph at 4:3 in a two-column layout with a 'Where we are' block containing the address, hours as a compact table, and transit directions. Then a short 'How we source' paragraph at 60 characters per line. Then the third photograph, full width. Then a footer with a wholesale enquiry email and opening hours.

Design tokens: background #F2EFE9, text #171512, hairline #DCD7CD, muted #6E695F, accent #7F3E1B. Radius 0 โ€” this brand is square. One grotesque at three weights plus one monospace. No serif.

Constraints: no stock photography, no coffee-bean icons, no parallax, no scroll animation, no cart. The page should be legible and complete with images disabled.

Paste the whole block into your builder. Replace the bracketed names with your own โ€” leave the constraints alone, they are what stops the generic output.

About this prompt

A small hospitality brand site where the type does the work and there are only three photographs.

Tags:#light-mode#minimal#brand#typography
Prompt Setup Guide

How to use this prompt & FAQs

Follow these simple steps to generate high-converting websites using Coffee shop brand site.

STEP 01

Copy System Prompt

Click the copy button above to grab the structured system prompt for "Coffee shop brand site".

STEP 02

Paste into AI Builder

Open Lovable, Codex, Cursor, Claude, Windsurf and paste the system prompt into the composer or initial prompt box.

STEP 03

Generate & Refine

Replace any bracketed text like [App Name] with your specific details, then click generate.

Frequently Asked Questions

More like this

Other restaurant prompts

Coffee shop brand site โ€” AI prompt for Restaurant | SitePromts ยท SitePromts