How to Build a Website with Claude: 4 Ways to Make It Live

You can build a website with Claude in four real ways depending on your technical comfort and where you want it hosted: publish an instant page straight from Claude.ai’s chat interface, use Claude Code to scaffold and deploy a custom site to Vercel or Netlify, have Claude Code build a WordPress site you host yourself, or push a free static site to GitHub Pages. Each path takes minutes to hours, not days, and this guide walks through all four end to end.

What Is Claude AI?

Claude is Anthropic’s family of AI models, accessed primarily through the Claude.ai chat interface, the Claude mobile and desktop apps, and Claude Code, a terminal-based coding agent. Unlike a dedicated website builder such as Lovable or Bolt, Claude wasn’t originally built as an app-generation tool — it’s a general reasoning and writing assistant that also happens to write excellent code, which is exactly why it can build a website when you know which part of it to use for that job.

The current model lineup includes Claude Opus 5 (the most capable, best for complex planning), Claude Sonnet 5 (the default, balanced model used in most everyday chat and coding), and Claude Haiku 4.5 (fast and lightweight for simple tasks). For building a website specifically, two Claude surfaces matter most:

• Claude.ai (the chat interface) — where you describe what you want in plain language and Claude can generate a working webpage as an “Artifact” you can preview and publish directly, no coding or setup required.
• Claude Code — a command-line tool that runs on your computer, writes real project files (HTML, React, WordPress themes, whatever the project needs), and can push code to GitHub or deploy it to a hosting provider, giving you far more control than the chat interface alone.

Which one you use determines which of the four paths below fits your project.

Setting Realistic Expectations Before You Start

Claude can write and structure an entire website for you, but it isn’t a one-click “buy a domain and go live” tool the way some dedicated AI app builders are. You’ll still need to make a few decisions yourself along the way — where to host, whether you want a custom domain, and how much ongoing control you want over the code. This guide covers all four realistic combinations so you can pick based on your actual situation rather than guessing.

Option A: Claude.ai Artifacts — Fastest, No Code Required

This is the quickest path from an idea to a shareable, live web page, and it needs nothing installed on your computer.

Step-by-Step

1. Open Claude.ai and start a new conversation.
2. Describe your website in detail. Include the pages or sections you want, your business name, colors or style preferences, and any specific copy you already have. The more specific your prompt, the less back-and-forth you’ll need afterward.
3. Review the generated page. Claude builds it as a self-contained HTML page you can preview directly in the conversation.
4. Ask for changes conversationally. “Make the header sticky,” “change the accent color to green,” “add a contact form section” — Claude updates the same artifact rather than starting over.
5. Click Publish. This generates a live, shareable link hosted on Claude’s own infrastructure that you can send to anyone immediately.

What This Option Is Actually Good For

Quick portfolios, single-page landing pages, an idea you want to test or share before investing further, or a mockup to show a client before committing to a full build. It’s the fastest of all four options by a wide margin.

The Real Limitation

A page published this way lives on a claude.ai link, not your own custom domain — there’s currently no built-in way to point your own domain directly at a published Artifact. If you need your own domain from day one, skip to Option B or C below.

Option B: Claude Code + Vercel or Netlify — Custom Domain, Developer Control

This path takes longer to set up but gives you a real, custom-coded site on your own domain with full version control.

What You’ll Need First

• Claude Code installed (available with a Claude Pro, Max, or Team subscription)
• A free GitHub account
• A free Vercel or Netlify account
• A domain name (from a registrar like Namecheap if you don’t already have one)

Step-by-Step

1. Install Claude Code by following Anthropic’s setup instructions for your operating system, and sign in with your Claude account.
2. Create a project folder on your computer and open it in your terminal.
3. Describe your website to Claude Code directly in the terminal — the pages you want, the structure, the design direction. Claude Code will scaffold the actual project files (typically a React or plain HTML/CSS/JS site).
4. Preview locally. Claude Code can run a local development server so you can see the site in your browser before deploying anything.
5. Iterate with follow-up prompts until the design and content are right — Claude Code can edit specific files, fix bugs, and add new pages or sections on request.
6. Push the project to GitHub. Ask Claude Code to initialize a git repository and push it, or do this manually if you’re comfortable with git.
7. Connect the repository to Vercel or Netlify. Both offer a free tier — sign in, import your GitHub repository, and it deploys automatically.
8. Connect your custom domain in the Vercel or Netlify dashboard by adding the DNS records they provide at your domain registrar.

This is conceptually the same domain-connection process covered in our Lovable domain setup guide — the specific interface differs, but the underlying DNS steps (A records, CNAME records, propagation wait time) work the same way regardless of which platform you’re deploying to.

Option C: Claude Code + WordPress Hosting — Best for Long-Term Content Management

If you want a site your team can update through a familiar admin dashboard after launch, rather than asking Claude to edit code every time you need a content change, WordPress is the better long-term foundation — and Claude Code can build directly for it.

Step-by-Step

1. Set up WordPress hosting first. A budget-friendly, beginner-ready option like Hostinger includes a one-click WordPress installer, or a premium managed host like WPX if speed and support matter more than price.
2. Install WordPress through your host’s dashboard — most hosts, including the two above, do this in a few clicks with no manual setup.
3. Describe the WordPress theme or site you want to Claude Code, and it can generate custom theme files, template structure, and PHP functionality based on your description.
4. Upload the generated files to your WordPress installation via FTP or your host’s file manager, or connect an MCP-based WordPress plugin that lets Claude read and write directly to your site’s content and settings without you manually transferring files each time.
5. Activate the theme in your WordPress admin dashboard under Appearance → Themes.
6. Connect your domain — if you registered your domain with the same host, this is usually automatic; otherwise point your domain’s nameservers or DNS records at your hosting provider.

If you’d rather use Elementor’s visual page builder on top of a Claude-assisted foundation instead of custom-coded PHP, our WordPress vs. Manus vs. Lovable comparison covers how WordPress specifically compares to AI-native app builders for long-term content ownership and SEO — a relevant read if you’re deciding between this option and Option B.

Option D: Claude Code + GitHub Pages — Free, Static Sites Only

For a simple site with no forms, no database, and no server-side logic, this is the lowest-cost path available — genuinely free hosting with no subscription required beyond Claude itself.

Step-by-Step

1. Ask Claude Code to build a static site — plain HTML, CSS, and JavaScript, with no backend requirements.
2. Create a new GitHub repository for the project, or have Claude Code initialize one for you.
3. Push your project files to the repository’s main branch.
4. Open your repository’s Settings tab on GitHub, go to the Pages section, and select the branch you want to publish from.
5. GitHub generates a live URL (typically yourusername.github.io/repository-name) within a few minutes.
6. Optional: connect a custom domain by adding a CNAME file to your repository and configuring DNS at your registrar — GitHub’s own documentation walks through the exact records needed.

Comparing All Four Options

What Claude Can’t Do for You in Any of These Paths

• It won’t buy a domain or configure DNS automatically. Every path above still requires you to register a domain yourself and manually add the records your host or platform provides.
• It doesn’t include a database or backend by default. If your site needs user accounts, a real database, or payment processing, tools built specifically for that — like Lovable, which pairs directly with Supabase — are a more direct fit than assembling that infrastructure manually around Claude. Our Manus vs. Claude comparison covers this distinction between reasoning tools and dedicated app builders in more depth.
• It won’t manage ongoing hosting or renewals. Once your site is live, you’re responsible for the hosting relationship and domain renewal just as you would be with a site built any other way.

Which Option Should You Actually Pick?

If you just want to see an idea live today, start with Option A. If you’re comfortable with a terminal and want a fully custom site on your own domain, Option B gives you the most control. If you want a site that a non-technical team member can update for years without touching code, Option C on WordPress is the more durable foundation. And if your project is genuinely simple — a single static page with no moving parts — Option D costs nothing at all beyond your Claude subscription.