Turn your landing page into a scroll story
northwind.example.comExample output
Made with Claude Code · SkillSkill, Members
Works with Claude, Claude Code, ChatGPT and 18 more
- Pick of the monthNorthwind Coffee | Fresh beans, every other Fridaynorthwind.example.comExample output
Made with Claude · BoilerplateWeb page
Northwind Coffee landing page. Mockup of the finished page for a made-up coffee subscription, drawn with GPT Image 2.5 from a prompt written in Claude.
- Northwind Coffee | Our beans by the bag, from 1 Decembernorthwind.example.comExample output
Made with Claude Code · BoilerplateWeb page
Northwind Coffee waitlist page. The waitlist version as Claude Code filled it in, screenshotted as built, before a form service was connected. Photo from the mood board example.
Works with
- Claude Code
Cursor
Codex- +5 more
Not affiliated with or endorsed by the companies shown.
Web and landing pagesBoilerplateMembers
Launch a one-page site with your AI in an hour
A ready landing page folder your coding agent fills in with your business, then helps you put online.
Version 1.1Updated 12 Oct 2026
Membership also includes Build a brand kit in an afternoon and Set up the system behind your business.
- Needs access to
- None
- Permissions
- Reads files you give it and writes files in a folder
- Time to result (our estimate)
- 10 minutes to set up, 50 minutes a run
Example
Why we picked it
Boilerplate of the month
A first website usually stalls on the setup. This is plain HTML and CSS your coding agent fills in from a few sentences about your business, so a finished one-page site takes about an hour (our estimate), with nothing to install or keep updated.
Fit
About this item
A one-page site folder that your coding agent fills in for you. Open it in Claude Code or Cursor, say what your business does, and the agent writes the headline, sections and contact details, swaps in your photos and checks the page on mobile.
Not open yet? Choose the waitlist version: the same page with an email sign-up in place of the main button, plus the two emails to send people on the list. When you are ready, GO-LIVE.md walks you through putting the page online with a free host, step by step, and adding your own domain if you want one. Tools come from their own sites, with their costs listed here; nothing is bundled.
The agent instructions keep it simple and fast, and tell the agent what not to break when you ask for changes later. The examples are for Northwind Coffee, a made-up coffee brand.
What you get
- A finished one-page site
- A waitlist version for before you launch
- A step-by-step guide to putting it online
- Agent instructions that keep later edits tidy
- Mobile and desktop layouts
Good fit
- A first website
- A page for a new product or offer
- Collecting a waitlist before you launch
Not for
- Multi-page sites with a blog or a shop
Who it is for
Skill level: Build with agents
How to use
Where it opens
Claude Code
Open the folder and say "Fill this in for my business". It reads AGENTS.md first.
Cursor
Open the folder and ask the agent the same thing. It reads AGENTS.md too.
How to use it
In Claude Code
Download and unzip the boilerplate.
Open the folder in Claude Code. It reads AGENTS.md first.
Same steps in
- Cursor
- Codex
Gemini CLI
GitHub Copilot
Amp
Goose
OpenCode
Download and unzip the boilerplate.
Open the folder in your AI tool. It reads AGENTS.md first.
Trust
What's inside
- landing-page folder
- AGENTS.md3.3 KB
- CLAUDE.md11 B
- GO-LIVE.md2.7 KB
- index.html2.9 KB
- styles.css2.6 KB
- waitlist-emails.md900 B
- waitlist.html3.5 KB
File names and sizes only. The files come with membership.
Permissions required
Reads files you give it
Writes files in a folder
Requirements
You bring
- Your business name and what you sell
- Two or three photos
- A coding agent such as Claude Code or Cursor
Plans it needs
- Claude Code: Claude Pro or higher
Outside costs
- Hosting on Netlify or GitHub Pages (go-live guide): Free plan
- Waitlist only: Formspree, free for 50 sign-ups a month: Then from $15 a month
- Your own domain name (optional): About $10 to $20 a year (our estimate)
Tested on
VerifiedTested in the last 90 days- Claude Code5 Oct 2026
- Cursor2 Oct 2026
Known limitations
- Hosting is up to you. The go-live guide covers two free options, Netlify and GitHub Pages, and each needs an account.
- It is one page. Shops, bookings and logins need more than this boilerplate.
More
Related items
Made with Claude Code · SkillFind out why Google skips your page, with a fix list
MarkdownExample outputWhy Google skips the beans page, and the fixes
Ten fixes, most important first
Verdict: the page tells Google to leave it out of search results. The line
<meta name="robots" content="noindex, nofollow">does that on its own, whatever else is on theI checked the page source you pasted against your three searches: "fresh roasted coffee beans", "buy coffee beans online" and "coffee beans Harbour Street". Here is what to fix,
Fixes, most important first
1. Delete the line that hides the page from Google
Impact: High · Time: 2 minutes
- What we found: the head of the page contains
<meta name="robots" content="noindex, nofollow">. - Why it matters: "noindex" tells Google not to show this page in results at all, and "nofollow"
-
Made with Claude Code · SkillSkill, Free
Works with Claude, Claude Code, ChatGPT and 18 more- What we found: the head of the page contains
Tear down and rewrite your landing page copy
MarkdownExample outputAcme Planner landing page: teardown and rewrite
You've given me everything I need: the copy, who it's for, the one action and proof you're allowed to use. Here's the teardown.
The five second test
Only what shows before scrolling: the headline, the subheadline and the buttons.
Question What the words say Mark What is it? "the all-in-one AI-powered productivity platform". That could be a planner, a notes app or a chat tool. Only the product name hints at planning. Vague Who is it for? "modern teams". Every team thinks it's modern. Nothing says 2 to 10 people or a shared calendar. Vague Why should I care? "Plan smarter. Work better. Achieve more." No problem named and no result a visitor Made with Claude Code · SkillSkill, Members
Works with Claude, Claude Code, ChatGPT and 18 more
Questions
- Do I need to know how to code?
- No. You describe your business in plain words and the agent edits the files. It helps to be comfortable opening a folder and reading what the agent changed.
- Why plain HTML and CSS?
- There is nothing to install and nothing to update, it loads fast, and any host can serve it. Your agent can move it to a framework later if you need one.
- How do I put it online?
- Follow GO-LIVE.md in the folder, or ask your agent to walk you through it. The quickest way is to drag the folder onto Netlify Drop, free with a Netlify account; GitHub Pages is free too. A domain of your own is optional, at about $10 to $20 a year.
- How does the waitlist version collect emails?
- Through a form service you choose, never through our files. The guide covers Formspree (free for 50 sign-ups a month, formspree.io/plans) and Google Forms (free). It also has the two emails to send people on the list: thanks for joining, and we are open.
- What do AGENTS.md and CLAUDE.md do?
- AGENTS.md tells any coding agent how this site is built and what not to break. CLAUDE.md points Claude Code to the same file, so there is one set of rules.