{ "slug": "squarefoot", "name": "Squarefoot", "title": "Free home renovation website template", "description": "Free HTML home renovation website template for builders, loft and extension firms, with square-foot prices. AGENTS.md for Claude Code, or no code with 8B.", "kind": "One-page website for a design-and-build renovation company, for owners of older houses who want a kitchen, extension, loft or bathroom", "summary": "A one-page site for a renovation firm: a four-stage method, six services as the rooms of a floor plan, three prices per square foot, five finished projects, a weekly site diary, a letter to the neighbours, a snag list, reviews, a folder of questions and a site-visit form. It is set on warm graph paper with handwritten pencil notes, cobalt duotone photos and sheets in manila, vermilion and cobalt.", "fits": [ "home renovation or design-and-build firm", "kitchen, bathroom, loft or extension specialist", "architect or interior designer who also builds", "any trade that quotes by area and wants to show its process and diary" ], "categories": [ "Architecture and building", "Local business" ], "tags": [ "home renovation", "builder", "construction", "extensions", "loft conversion", "kitchen fitter", "architect", "graph paper", "handwritten notes", "duotone", "gsap", "scrolltrigger", "lenis", "single-file" ], "language": "en", "size_kb": 109, "photos": 13, "fonts": [ "Playpen Sans", "Schibsted Grotesk" ], "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/lenis@1.3.27/dist/lenis.min.js" ], "browsers": "Chrome and Edge 111+, Safari 16.2+, Firefox 121+ (it uses color-mix(), :has(), cascade layers, small/dynamic viewport units).", "sections": [ { "key": "navigation", "id": "nav", "heading": "", "about": "fixed paper strip: four-tile logo, wordmark, five links, Book a site visit button; two pencil notes in the corners; phone menu overlay" }, { "key": "opening", "id": "opening", "heading": "One sheet of graph paper, one crew.", "about": "a full-screen sunlit-room photo in blue duotone with a paper sheet laid over it: heading, intro, pencil note, two actions and a small drawn plan" }, { "key": "method", "id": "method", "heading": "From pencil to keys, with the same four people", "about": "four stages (measure, draw, build, hand over) as a 2×2 contact sheet of photos that the camera zooms across, beside the four step texts" }, { "key": "rooms", "id": "rooms", "heading": "What we build, room by room", "about": "six services as the rooms of one floor plan, with door arcs and pencil labels (demo: refurbishment, cellar, kitchens, extensions, lofts, bathrooms)" }, { "key": "pricing", "id": "pricing", "heading": "Priced by the square foot", "about": "three sheets priced per square foot (demo: Refresh £65, Rebuild £140, Extend £210) with lists and buttons, and a footnote" }, { "key": "projects", "id": "projects", "heading": "Finished rooms", "about": "five finished rooms on a horizontal track that turn from blue duotone to full colour, with place, type and duration (demo: Chorlton, Didsbury, Levenshulme, Whalley Range, Burnage)" }, { "key": "diary", "id": "diary", "heading": "The site diary", "about": "a two-page notebook of six weekly entries from one extension, with two taped photos (demo: Chorlton, weeks 1 to 11)" }, { "key": "letter", "id": "letter", "heading": "Before we start, we write to your neighbours", "about": "on a dark ground, a letter to the neighbours rises out of an envelope while four logo tiles float around it" }, { "key": "snags", "id": "snags", "heading": "The snag list ends empty", "about": "a snag list of six items that are struck through and ticked in turn, then stamped Signed off, beside the guarantee text" }, { "key": "reviews", "id": "reviews", "heading": "Heard over the garden fence", "about": "three short reviews on paper slips (demo: Chorlton, Didsbury, Levenshulme)" }, { "key": "faq", "id": "faq", "heading": "Asked at the kitchen table", "about": "five questions in native disclosures inside a manila folder with a tab, beside a heading and a phone button" }, { "key": "contact", "id": "contact", "heading": "Book a free site visit", "about": "site-visit form with six fields, one of them a room select, beside a duotone street photo and a contact list (phone, email, yard, areas)" }, { "key": "footer", "id": "footer", "heading": "We build the room you keep sketching.", "about": "dark footer: four tiles that lock into the logo mark, a closing line, link columns, a large wordmark and the copyright with the Design: 8B credit" } ], "placeholders": [ "og-image", "favicon", "phone", "form", "email", "social" ], "lighthouse": null, "license": { "code": "MIT", "photos": "Unsplash License", "fonts": "SIL Open Font License 1.1" }, "get": { "degit": "npx degit 8bsite/home-renovation-website-template my-site", "curl": [ "curl -LO https://raw.githubusercontent.com/8bsite/home-renovation-website-template/main/index.html", "curl -LO https://raw.githubusercontent.com/8bsite/home-renovation-website-template/main/AGENTS.md", "curl -LO https://raw.githubusercontent.com/8bsite/home-renovation-website-template/main/LICENSE", "curl -LO https://raw.githubusercontent.com/8bsite/home-renovation-website-template/main/CREDITS.md" ], "agent_prompt": "Read AGENTS.md, then edit index.html. Make this the site for . Replace first the Manchester details, phone, email, prices, five projects, diary, neighbours' letter, snag list street and reviews. Keep the section ids, four method photos and steps, six plan rooms with their data-dx and data-dy, and the footer wordmark len. Ask me for missing facts and never invent prices, guarantees, reviews or contacts." }, "links": { "page": "https://8b.com/templates/squarefoot/", "md": "https://8b.com/templates/squarefoot.md", "json": "https://8b.com/templates/squarefoot.json", "demo": "https://8b.com/templates/squarefoot/demo.html", "ghDemo": "https://8bsite.github.io/home-renovation-website-template/", "repo": "https://github.com/8bsite/home-renovation-website-template", "zip": "https://8b.com/templates/squarefoot/home-renovation-website-template.zip", "use": "https://github.com/new?template_name=home-renovation-website-template&template_owner=8bsite", "agents": "https://github.com/8bsite/home-renovation-website-template/blob/main/AGENTS.md", "credits": "https://github.com/8bsite/home-renovation-website-template/blob/main/CREDITS.md", "raw": { "index": "https://raw.githubusercontent.com/8bsite/home-renovation-website-template/main/index.html", "agents": "https://raw.githubusercontent.com/8bsite/home-renovation-website-template/main/AGENTS.md", "license": "https://raw.githubusercontent.com/8bsite/home-renovation-website-template/main/LICENSE", "credits": "https://raw.githubusercontent.com/8bsite/home-renovation-website-template/main/CREDITS.md" }, "preview": "https://8b.com/templates/squarefoot/desktop.webp", "phone": "https://8b.com/templates/squarefoot/phone.webp", "clip": "https://8b.com/templates/squarefoot/scroll.mp4", "og": "https://8b.com/templates/squarefoot/og.jpg", "design_md": "https://8b.com/templates/squarefoot/DESIGN.md" }, "github": { "repo": "8bsite/home-renovation-website-template", "template_repository": true, "topics": [ "html-template", "landing-page", "website-template", "website-templates", "home-renovation", "builder-website", "construction-website", "html5", "agents-md", "gsap", "scrolltrigger", "scroll-animation", "lenis", "single-file", "cursor-ai", "static-site", "mit-license", "vibe-coding", "claude-code", "ai-agents" ] }, "made_by": { "name": "8B", "url": "https://8b.com/" } }