← Back to Use Cases

Building a client website with Claude Code instead of Webflow

I built a client website with Claude Code instead of Webflow. Then I lost another client because they wanted Webflow and I couldn’t bring myself to go back to manual building. Here’s the full case study.

Background

I learned Webflow in 2020 and built dozens of sites with it. Transitioned from architecture to web design because of it. I fought its limitations but I could always get the job done.

Then Claude Opus 4.5 arrived and something shifted. Previous models were toys. This one was a tool. It could understand design intent precisely, follow structured prompts, and produce code that actually matched the Figma file.

I realized Webflow and Opus are both no-code tools. Both let a non-developer create applications. And both punish you if you lack fundamentals. The abstraction layer moved up, but the requirement didn’t. If you don’t understand the box model, you’ll build a Frankenstein in Webflow. Same with AI.

The experiment

I designed a website for a client in Figma and set myself a test: build it entirely with Claude Code using spec-driven development.

It took four iterations to lock the workflow down.

Iterations 1-2: figuring out what works and what doesn’t. I collected feedback after each phase, and Claude helped identify where the process needed tightening.

Iteration 3: everything came together. We polished the workflow and created reusable skills for future projects.

Iteration 4: the production build. The actual site the client will use.

The workflow that emerged

Design prep. Your Figma file has to be clean. Autolayout everywhere, named layers, a design system that mirrors what you’ll use in code. Semantic and utility classes in both Figma and code (bg-primary, text-secondary, container-large). When both are synced, Claude makes fewer errors.

I created a validation skill that analyzes the Figma file before building: checks structure, layer naming, autolayout usage, hardcoded values. Catching design issues before the build is cheaper than fixing code later.

Section-by-section execution. Every page is planned and built section by section. This keeps context tight. The bigger the context window gets, the more error-prone the model becomes. Slow, deliberate execution beats throwing an entire page at the model.

Quality control. Claude can claim something works when it doesn’t. I verify every build manually. Common issues: layout drift where spacing doesn’t match the design, missing responsive states on tablet/mobile, subtle interactive states. None are hard to fix, but you won’t catch them unless you look.

With this process, Claude one-shots a page section at roughly 90% accuracy. The remaining 10% is bug reporting back to Claude or manual tweaking.

Hosting and CMS

Hosting: pushed to GitHub, connected to Vercel. Free tier. Every push deploys automatically. Set up a staging domain for preview before going live. Cheaper than Webflow at any scale.

CMS options: Markdown files with SvelteKit (what this site uses, with custom components inside markdown, something Webflow CMS still can’t do). Or a headless CMS like Payload, Prismic, or Keystatic for clients who need a visual editing interface.

Cost comparison

ItemWebflowClaude Code
Platform/tool~$400/yr agency plan~$100/mo Claude Code (used for everything, not just sites)
Client site hosting~$200-400/yr per siteFree (Vercel free tier) to ~$20/mo
CMSIncluded (limited)Markdown (free) or headless CMS (free-paid)
FlexibilityPlatform constraintsNo limits
Vendor lock-inYesNo

What changed

The productivity difference was the first thing I noticed. A custom homepage that took 4-6 hours in Webflow takes about an hour with Claude while I work on other things.

But the real shift was capability. I integrated the website into my business operating system. Reports, analytics, publishing, content creation, all within one interaction with Claude. A Webflow site is a static deliverable. A code-based site is a living system.

The biggest downside: no visual editor. But since I know HTML and CSS and use Svelte (more readable than React), I can edit the last bits directly. The trade was obvious for me.

Client handover

The concern I hear most: “What about clients editing the site?”

In practice, most of my clients either ask me to make changes or don’t touch it. But for those who need self-service, I’m building a set of Claude skills that let the client modify pages, build new ones, and publish changes through Claude. The site is structured in components and sections, so there’s little room to break things. Less room, honestly, than a client dragging elements in Webflow.

Who this is for

If you can build in Webflow, you already understand the box model. You can read HTML and CSS. You’re closer to this than you think.

The question is whether you’re willing to leave the visual editor behind. For me, flexibility, cost, speed, and no platform lock made it obvious. For you it might not be yet.

Try building one section of an existing project with Claude Code. Not a full site. One section. That’s the test that convinced me.

For the full story with video walkthroughs, read the original blog post.

Explore next