Tunas Coffee Website

01 — The brief

Most coffee shop websites are built for first-time visitors: big hero, tagline, call to action. Tunas Coffee wanted the opposite: a site that rewards regulars, surfaces today’s pick, and feels as familiar as their Instagram. Content-first, no hero, no marquee.

02 — What’s inside

• Sticky 3-column nav: icon row left, logo centre, order button right
• Stories strip: horizontally scrollable circular previews (beans, drinks, promos, events)
• “Today’s Pick” split section: visual panel left, menu detail and order CTA right
• Feed grid: 12-post Instagram-style layout with regular, wide (2×1), tall (1×2), and quote post variations
• Info section: 3-column dark panel with about blurb, opening hours, and location + map link
• Hamburger mobile menu with full-screen overlay
• Fully responsive: 1-column feed on mobile, 3-column on desktop

03 — Spec & details

• Format: HTML / CSS / JS (single file, no build step)
• Pages: 1 (homepage)
• Brand: Built on the Tunas Coffee identity system
• License: Personal + Commercial

04 — Who it’s for

Coffee shops and small F&B brands that are already active on Instagram and want a web presence that mirrors that energy. The feed grid is designed to be updated manually by swapping image URLs and caption text. No CMS required. Pair it with the Tunas Coffee brand kit for a complete, launch-ready package.