{
 "slug": "loud-kettle",
 "name": "Loud Kettle",
 "title": "Loud Kettle, a free brewery website template",
 "kind": "Website for a craft brewery and taproom: beers on tap, events and table booking",
 "summary": "A one-page site for a small craft brewery with a taproom in an old tram shed: the tap list, a flight builder, brew day, events and a booking form. Near-black ground, cream tags and loud condensed capitals; an amber disc behind the hero pint floods the second screen, the beer cards fill with colour like glasses as they step down, and the brew-day steps turn on a wheel as you scroll.",
 "fits": [
  "craft brewery or brewpub",
  "taproom, beer bar or cider house",
  "distillery, winery or coffee roaster with a tasting room",
  "any small venue with a menu of products, events and bookings"
 ],
 "categories": [
  "Food and drink"
 ],
 "tags": [
  "brewery",
  "craft beer",
  "taproom",
  "bar",
  "restaurant",
  "events",
  "booking",
  "dark",
  "bold typography",
  "gsap",
  "scrolltrigger",
  "lenis",
  "single-file"
 ],
 "language": "en",
 "size_kb": 96,
 "photos": 24,
 "fonts": [
  "Bricolage Grotesque",
  "Onest"
 ],
 "libraries": [
  "https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/gsap.min.js",
  "https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/ScrollTrigger.min.js",
  "https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/SplitText.min.js",
  "https://cdn.jsdelivr.net/npm/lenis@1.3.27/dist/lenis.min.js"
 ],
 "browsers": "Chrome and Edge 111+, Safari 16.2+, Firefox 113+ (it uses color-mix(), cascade layers, small/dynamic viewport units).",
 "sections": [
  {
   "key": "navigation",
   "id": "nav",
   "heading": "",
   "about": "top bar: two-line wordmark, section links, Book a table button; phone menu overlay"
  },
  {
   "key": "opening",
   "id": "opening",
   "heading": "The kettle's loud. The beer's louder.",
   "about": "two-screen hero: headline, product photo on a brand-colour disc with three orbiting photos, then a manifesto sentence on the brand colour (demo: a pint and ingredients)"
  },
  {
   "key": "no-shortcuts",
   "id": "no-shortcuts",
   "heading": "Four things that never go in the kettle",
   "about": "column of four hanging tag-cards (principles or features) among floating round photos"
  },
  {
   "key": "on-tap",
   "id": "on-tap",
   "heading": "What's pouring",
   "about": "giant outlined word over five product cards in a staircase, each in its own colour (demo: the beers on tap)"
  },
  {
   "key": "flights",
   "id": "flights",
   "heading": "Build a flight of four. $14",
   "about": "interactive picker: choose four items into round slots, then save (demo: a beer flight)"
  },
  {
   "key": "brew-day",
   "id": "brew-day",
   "heading": "From grain to glass",
   "about": "five numbered process steps that turn on a big wheel as you scroll (demo: brew day from grain to glass)"
  },
  {
   "key": "taproom",
   "id": "taproom",
   "heading": "The tram shed",
   "about": "the venue: heading, lead, one wide and two small photos, three fact cards (demo: hours, dogs, food truck)"
  },
  {
   "key": "overheard",
   "id": "overheard",
   "heading": "Overheard",
   "about": "testimonials: giant outlined word and a slow scrolling row of six quotes on tag-cards"
  },
  {
   "key": "faq",
   "id": "faq",
   "heading": "Ask the bar",
   "about": "questions and answers (native <details>), sticky heading on desktop"
  },
  {
   "key": "events",
   "id": "events",
   "heading": "Loud nights",
   "about": "list of dated events as ticket rows: date stub, title, text, price and time"
  },
  {
   "key": "visit",
   "id": "visit",
   "heading": "Come thirsty",
   "about": "contact: photo of the venue, address, hours, phone and email cards, and a booking request form (placeholders)"
  },
  {
   "key": "footer",
   "id": "footer",
   "heading": "Join the Kettle Club",
   "about": "width-filling outlined wordmark, links, newsletter signup, social icons, copyright and the Design: 8B credit"
  }
 ],
 "placeholders": [
  "og-image",
  "favicon",
  "map",
  "phone",
  "email",
  "form",
  "social"
 ],
 "lighthouse": null,
 "license": {
  "code": "MIT",
  "photos": "Unsplash License",
  "fonts": "SIL Open Font License 1.1"
 },
 "get": {
  "degit": "npx degit 8bsite/brewery-website-template my-site",
  "curl": [
   "curl -LO https://raw.githubusercontent.com/8bsite/brewery-website-template/main/index.html",
   "curl -LO https://raw.githubusercontent.com/8bsite/brewery-website-template/main/AGENTS.md",
   "curl -LO https://raw.githubusercontent.com/8bsite/brewery-website-template/main/LICENSE",
   "curl -LO https://raw.githubusercontent.com/8bsite/brewery-website-template/main/CREDITS.md"
  ],
  "agent_prompt": "Read AGENTS.md, then edit index.html. Use this template as the base for a site for <your brewery, taproom or bar: name, city, what's on tap with styles and prices, opening hours, address, events, how to book>. Keep the layout, the motion and the single-file format; replace the brand name, copy, beers, prices, hours, events, quotes, photos, links and contacts, and recolour it through the CSS variables if needed."
 },
 "links": {
  "page": "https://8b.com/templates/loud-kettle/",
  "md": "https://8b.com/templates/loud-kettle.md",
  "json": "https://8b.com/templates/loud-kettle.json",
  "demo": "https://8bsite.github.io/brewery-website-template/",
  "repo": "https://github.com/8bsite/brewery-website-template",
  "zip": "https://github.com/8bsite/brewery-website-template/archive/refs/heads/main.zip",
  "use": "https://github.com/new?template_name=brewery-website-template&template_owner=8bsite",
  "agents": "https://github.com/8bsite/brewery-website-template/blob/main/AGENTS.md",
  "credits": "https://github.com/8bsite/brewery-website-template/blob/main/CREDITS.md",
  "raw": {
   "index": "https://raw.githubusercontent.com/8bsite/brewery-website-template/main/index.html",
   "agents": "https://raw.githubusercontent.com/8bsite/brewery-website-template/main/AGENTS.md",
   "license": "https://raw.githubusercontent.com/8bsite/brewery-website-template/main/LICENSE",
   "credits": "https://raw.githubusercontent.com/8bsite/brewery-website-template/main/CREDITS.md"
  },
  "preview": "https://8b.com/templates/loud-kettle/desktop.webp",
  "phone": "https://8b.com/templates/loud-kettle/phone.webp",
  "clip": "https://8b.com/templates/loud-kettle/scroll.mp4",
  "og": "https://8b.com/templates/loud-kettle/og.jpg"
 },
 "github": {
  "repo": "8bsite/brewery-website-template",
  "template_repository": true,
  "topics": [
   "html-template",
   "landing-page",
   "website-template",
   "free-template",
   "brewery-website",
   "brewery-template",
   "craft-beer",
   "html5",
   "css",
   "gsap",
   "scrolltrigger",
   "scroll-animation",
   "lenis",
   "single-file",
   "no-build",
   "static-site",
   "mit-license",
   "vibe-coding",
   "claude-code",
   "ai-agents"
  ]
 },
 "made_by": {
  "name": "8B",
  "url": "https://8b.com/"
 }
}