Coffee Shop Website Templates

The menu, the hours, where you are, and the beans if you sell them.

Most coffee shop visitors are on a phone deciding whether to walk over. They want the menu, today's hours and the address. Shops that roast also want to sell a bag of beans. The three templates below lean different ways on that split.

Ember & Roast is a roastery, cafe and slow bar with "Order beans" in the header. Kilnhouse Coffee is a neighbourhood cafe with "Order ahead" and a menu button. Cendre is roaster-first, with the current roast date shown large and a wholesale link.

3 coffee shop website templates

Warm Dark Coffee Roastery (Restaurant; demo site: Ember & Roast)
Cream & Terracotta Coffee Shop (Restaurant; demo site: Kilnhouse Coffee)
Bean-Photo Typographic Coffee Shop (Restaurant; demo site: Cendre)

What a good coffee shop website needs

The menu with prices

Espresso and milk drinks, filter by the cup, pastries. A price range is enough.

Hours and address on every page

Weekday and weekend opening times and a map link. Update them when they change.

Beans, if you sell them

Bag size, price and roast date. Link a shop or subscription tool if you run one.

Photos of your room and bar

People choose a cafe partly for where they will sit. Show your own space.

How to pick the right one

Cafe that also roasts and sells beans: Ember & Roast has Menu, Our Story, Gallery, Visit and "Order beans".
Walk-in cafe that wants to cut the queue: Kilnhouse has "Order ahead" and "See the menu".
Roaster with one cafe and wholesale customers: Cendre has Coffee, Roastery, Wholesale and a roast date up top.
Replace every demo count, rating and year in business with your own, or remove it.

Frequently asked questions

Are these templates free?

Starting from a template is free. The free plan gives you 3 template sites on a we.inc address with no card. It has no AI credits and no custom domain. AI building and custom domains start at $20 a month.

Can customers order ahead or buy beans online?

Ordering and checkout are not built into these templates. Link the ordering app or shop you already use to the button.

Can I update the menu myself?

Yes. Edit the text in the editor, or on a paid plan ask the AI to change it.

Other template collections

Building sites for clients?

Put your own brand on the builder and sell these templates as your own product. Launch a white-label AI website builder free in under a minute, or read how to resell websites under your own brand.

Three coffee shop layouts: cafe, order-ahead and roaster

North Bell Coffee (a made-up roaster and cafe) sells espresso and milk drinks, filter by the cup and 12 oz bags of whole beans. Here is how three coffee templates handle each.

How these were picked

Three catalogue templates checked against their previews: Ember & Roast, Kilnhouse Coffee and Cendre, plus the North Bell sample as the demonstration. Its prices, counts and reviews are made up. Checked 27 September 2026. Every design here is from the We.Inc library and is labelled as a sample or template. None is a customer site, and no entry claims results.

1. Warm Dark Coffee Roastery

Restaurant template from the We.Inc library (demo site: Ember & Roast). Open it

Task: A roastery and cafe that sells beans too.

Design choice: Ember & Roast: Menu, Our Story, Gallery, Visit and "Order beans"; "Roastery / Cafe / Slow bar", single-origin espresso and slow bar filters, with "See the menu" and "Find us".

Limitation: Bean ordering needs your own shop link.

2. Cream & Terracotta Coffee Shop

Restaurant template from the We.Inc library (demo site: Kilnhouse Coffee). Open it

Task: A walk-in cafe that wants to cut the queue.

Design choice: Kilnhouse: Menu, Beans, Visit, FAQ and "Order ahead"; seasonal espresso, filter brewed to order and "Roasted here, small batches every Tuesday and Friday".

Limitation: Order ahead is only a button; connect it to your ordering app.

3. Bean-Photo Typographic Coffee Shop

Restaurant template from the We.Inc library (demo site: Cendre). Open it

Task: A roaster with one cafe and wholesale customers.

Design choice: Cendre: Coffee, Roastery, Wholesale, Find us; the current roast date shown large and "Coffee roaster, one cafe".

Limitation: Roaster-first; the cafe menu has to be added.

4. North Bell Coffee

Sample site built by our AI (made-up business). Open it

Task: The demonstration: bar and beans priced together.

Design choice: "Roasted here Tuesday, in your cup Thursday"; espresso and milk drinks $3.25 to $5.75, filter by the cup $4.25, whole bean 12 oz $18 to $24.

Limitation: Made-up prices, counts and reviews.

Task comparison

Design	Espresso and milk drinks	Filter by the cup	Whole bean, 12 oz
Warm Dark Coffee Roastery	Named in hero	Slow bar filters	Order beans button
Cream & Terracotta Coffee Shop	Seasonal espresso	Filter brewed to order	Beans page
Bean-Photo Typographic Coffee Shop	Add menu	Add menu	Good fit
North Bell Coffee	$3.25 to $5.75	$4.25	$18 to $24

Walkthrough: buying a bag of beans on the North Bell sample

They read "Roasted here Tuesday, in your cup Thursday" and tap "Shop beans".
"Bar and beans" shows whole bean 12 oz at $18 to $24, roast date printed on every bag.
Below it, a subscription every 2 or 4 weeks from $17 a bag.
The button goes to your existing shop; checkout is not built into the template.

Copyable build brief

A website for [cafe], a coffee shop in [area]. Our menu with prices (espresso and milk drinks, filter by the cup, pastries), whole beans with bag size, price and roast date, opening hours and address on every page, photos of our room, and buttons for order ahead and our bean shop.

What We.Inc does and does not do here

Online ordering	Not built in. Link your ordering app.
Bean shop or subscriptions	Not built in. Link the shop you already run.
Publishing for free	Free plan: up to 3 template sites on a we.inc address. No AI credits and no custom domain.
Having the AI write and change the site	Paid plans: Starter $20/mo, Pro $49/mo, Max $99/mo. You describe the business, then edit by clicking or by asking in chat.
Your own domain	Paid plans only.
Taking payments	Through your own Stripe account, so the money goes to you. We.Inc does not hold funds.
Forms	The AI builds contact and request forms. A synced booking calendar is not built in: link the scheduling tool you already use.

What to adapt

Pick cafe-first or roaster-first.
Keep hours correct.
Show your own room and bar.

What not to copy

Demo roast dates and addresses.
Stock latte art in place of your own drinks.

Start from a suitable design

Start building this coffee shop website. Or check costs with the website cost calculator, test a current site with the website grader, and see pricing.