The Prompt That Replaced Our Website
The Prompt That Replaced Our Website
Meta Description: We took Anthropic’s Website Wizard prompt, added 3 lines, and Claude Code replaced our entire Squarespace site. Here’s the original, the modification, and what you can steal.
Yesterday we replaced our Squarespace site in under 2 hours using Claude Code. The most common question: what prompt did you use?
The answer is embarrassingly simple. We grabbed a template from Anthropic’s prompt library and changed three things.
The Original: Anthropic’s Website Wizard
Anthropic maintains a prompt library with pre-built prompts for common tasks. The Website Wizard prompt is designed to create one-page websites with embedded HTML, CSS, and JavaScript.
Here’s the system prompt, word for word:
Your task is to create a one-page website based on the given specifications, delivered as an HTML file with embedded JavaScript and CSS. The website should incorporate a variety of engaging and interactive design features, such as drop-down menus, dynamic text and content, clickable buttons, and more. Ensure that the design is visually appealing, responsive, and user-friendly. The HTML, CSS, and JavaScript code should be well-structured, efficiently organized, and properly commented for readability and maintainability.
That’s it. One paragraph. It tells Claude to build a single HTML file with everything embedded — no frameworks, no build step, no dependencies. Exactly what we needed.
The example user prompt in the library asks Claude to build “EduQuest,” a fictional learning platform with nav bars, hero sections, course cards, and testimonials. Generic, but it demonstrates the pattern.
Our Modification: Three Changes
We didn’t rewrite the prompt. We kept the system prompt exactly as-is and modified the user prompt to do three things:
- Scrape our existing site instead of building from a spec
- Match our existing brand instead of using generic styling
- Target our specific sections instead of fictional ones
Here’s what we actually sent to Claude Code:
Create a one-page website to replace our current site at alienbraintrust.ai.
First, scrape the existing site — the homepage, about page, and training
page — to understand our current content, branding, look and feel.
Then build a single HTML file with embedded CSS and JS that includes:
1. Navigation with links to About, Training, Labs, Blog, and Contact
2. A hero section with our tagline and CTAs
3. An About section with our company info and values
4. A Training section featuring our AI-1001 course
5. A Labs section highlighting our free learning content
6. A Blog preview section with links to blog.alienbraintrust.ai
7. A Contact section
8. A footer
Match the dark theme with neon green accents from our existing site.
Make it responsive with a mobile hamburger menu.
Include dark/light mode toggle.
That was the entire prompt. Everything else — the CSS custom properties, the scroll animations, the IntersectionObserver, the localStorage theme persistence, the responsive breakpoints — Claude Code added on its own because the system prompt said “engaging and interactive design features.”
What the Scraping Step Actually Did
This was the key modification. Instead of describing our brand in detail, we told Claude to go read it.
Claude Code fetched three pages:
alienbraintrust.ai(homepage)alienbraintrust.ai/about(company info, 4 pillars, founder bio)alienbraintrust.ai/training(AI-1001 course modules)
From those pages, it extracted:
- Our color palette (dark backgrounds, green accents)
- Our copy (mission statement, company description, course modules)
- Our content structure (what sections existed and in what order)
- Our brand voice (alien/sci-fi persona, practical AI focus)
We didn’t have to write a design spec. We didn’t have to copy-paste our own content. The AI read the existing site and used it as the foundation. We just course-corrected with short follow-ups.
The Follow-Up Nudges
After the initial build, we gave about a dozen one-sentence corrections over the next hour. Here’s the actual list:
- “I want it to be clear that we’re an AI-first company”
- “The course is coming soon, not sure of cost yet”
- “Change the last module to AI Builder — leverage the Master Prompt Method to build anything”
- “Link the labs to blog.alienbraintrust.ai/labs/ not just the blog”
- “Blog links should take you to actual articles”
- “Make 2 of the 3 blog cards dynamic from a feed”
That’s it. Each one was a single sentence. Claude Code understood the context, made the change, and moved on. No back-and-forth. No “can you clarify what you mean by…” Just done.
Why This Pattern Works
The Website Wizard prompt works because it constrains the output format without constraining the design. “Single HTML file with embedded CSS and JS” eliminates an entire category of decisions — no framework choice, no build system, no dependency management.
Our modification works because scraping replaces specification. Instead of trying to describe your brand in words (which is hard and error-prone), you point the AI at the thing itself. It’s the difference between telling someone “paint my house the same shade of blue as the neighbor’s” versus handing them a Pantone swatch.
The combination — constrained format + scrape-based input + conversational refinement — turned a website rebuild into something that felt more like an editing session than a development project.
Try It Yourself: The Template
Here’s a generic version you can steal and modify for your own site:
System prompt (use exactly as Anthropic wrote it):
Your task is to create a one-page website based on the given specifications, delivered as an HTML file with embedded JavaScript and CSS. The website should incorporate a variety of engaging and interactive design features, such as drop-down menus, dynamic text and content, clickable buttons, and more. Ensure that the design is visually appealing, responsive, and user-friendly. The HTML, CSS, and JavaScript code should be well-structured, efficiently organized, and properly commented for readability and maintainability.
User prompt (modify for your site):
Create a one-page website to replace my current site at [YOUR-URL].
First, scrape the existing site to understand my current content,
branding, and design style.
Then build a single HTML file with embedded CSS and JS that includes:
1. [LIST YOUR SECTIONS]
2. [LIST YOUR SECTIONS]
3. [etc.]
Match the visual style from my existing site.
Make it responsive with a mobile menu.
Include dark/light mode toggle.
Then just talk to it. “Change this.” “Add that.” “Link this to here.” Each correction is one sentence.
What We’re Adding to the Course
This prompt pattern — take a template, modify it to scrape existing content, refine conversationally — is exactly the kind of practical AI workflow we teach. We’re adding a “Website Builder” exercise to the AI Builder module of AI-1001.
The exercise will walk students through:
- Finding the right prompt template in Anthropic’s library
- Modifying it for their specific use case
- Using the scrape-and-refine pattern
- Deploying the result to a free host
Because the whole point of AI-1001 is: stop playing with AI, start using it. Building a real website in under 2 hours for $0 is about as practical as it gets.
The Website Wizard prompt is part of Anthropic’s public prompt library. Our modification added scraping instructions and site-specific sections. The result is live at alienbraintrust.ai.
Comments