Food and drink
Coffee shop
A quiet black-and-white website for a specialty coffee shop with a short menu, beans to take home and opening hours.
Make it yours
Type your details. The preview and the recipe you copy change as you type.
Saved on this device only. No links are kept in these boxes.
Copy the recipe
The headings and the first line of each part. Copy the recipe to get every word.
What is inside the recipe
- 01Goal and audienceBuild a complete, ready to publish website for "Ninth Bean", coffee shop business in Kuwait.
- 02Stack and setupUse plain HTML, CSS and a little JavaScript, or Next.js with Tailwind if your tool prefers it. Mobile first.
- 03Design systemStyle: Minimal mono. Follow these exact values.
- 04Page structureOne page, sections in this exact order.
- 05HeroThe first screen. Use this copy exactly.
- 06Section: MenuShow the menu as a tidy list with prices aligned to one edge. Use the exact items.
- 07Section: ServicesShow these services as a clear, scannable list or grid. Use the exact wording.
- 08Section: Why usShow these reasons as short blocks with a bold title.
- 09Section: Opening hoursShow the opening hours as a simple two column table.
- 10Section: ReviewsShow three customer reviews as quotes. These are invented samples: label them as examples until real ones replace them.
- 11Section: QuestionsMake an accordion using the native details and summary elements.
- 12Section: ContactShow the contact details with large tap targets.
- 13FooterA simple footer with the brand, a short line and quick links.
- 14Components and interactionsBuild these behaviours, and keep the code small and readable.
- 15Arabic and right-to-leftThe site must work fully in Arabic, not just in English.
- 16AccessibilityMake it usable by everyone.
- 17Search and sharing basicsAdd the basics so the site can be found and shared.
- 18PerformanceIt should feel instant on a slow phone connection.
- 19Advice for this kind of businessReal owners care about these points. Reflect them in the copy and layout.
- 20Do notAvoid these mistakes.
- 21How the owner customises itFinish by adding a short guide for the owner in a README or an HTML comment.
- 22Done whenCheck each line before you say the website is finished.
What you get
- A complete brief for a coffee shop website with 7 sections, from hero to contact
- Exact colours, fonts and spacing for the minimal mono look
- Every line of copy written for you, in English and Arabic
- Right-to-left rules for the Arabic version
- A WhatsApp booking flow and a checklist to know it is finished
Questions about this recipe
What does this prompt build?
A minimal, monochrome coffee shop site with a short menu, beans, opening hours and a map-style contact block.
Can I add online ordering?
The prompt keeps it simple. You can ask your AI tool to add a WhatsApp order link.
Which fonts does it use?
A clean geometric sans for text and a larger weight for headings, no special font files required.
What photos do I need?
Three or four close photos of cups, beans and the bar in daylight.
More recipes you may like
Build it step by step in the course
Not sure how to use a recipe? The free course walks you through it, one small step at a time.