Building with Claude

Archival is LLM-native, which means it can work with you like a designer to help you get started. Our Claude skill knows how to build Archival sites that will work great with our editor, and will get you set up with a live preview URL of your totally custom website by asking you a few questions.

Starting from archival.dev

The Build it with Claude button — on the home page, and at the bottom of this page — is the shortest path. It sets up a preview session, then hands Claude a prompt that already carries everything the agent needs.

If you have the Claude app, it opens with the prompt filled in. If you don't, hit open Claude in your browser for the same conversation. We'll use the Archival MCP connector to build your site directly to a preview that you can take live in a few clicks.

That connector is the one thing to set up first — add it in one click, then start a new chat. Claude will tell you if it's missing, but it can't add it for you, and a connector added partway through a conversation doesn't show up in that conversation.

Installing the plugin

We publish a Claude plugin so you can generate previews whenever you like. Since subdomains are $1 per month per site, this is a great way to build fun sites quickly.

/plugin marketplace add archival-dev/archival
/plugin install archival@archival

Installing it also connects our MCP server, which is what the skill actually drives.

Connecting the MCP server on its own

The plugin is Claude Code specific. Any MCP client can connect to the MCP server directly:

https://api.archival.dev/mcp

In Claude — the app or claude.ai — add the Archival connector in one click. That link opens the add-connector dialog with the name and URL already in it, so all you do is confirm. To add it by hand instead, it lives under Customize → Connectors, with the URL above.

A connector only shows up in chats you start after adding it, so if a conversation says it hasn't got the Archival tools, start a new one.

In Claude Code that's:

claude mcp add --transport http archival https://api.archival.dev/mcp

Making new sites with the Claude plugin

Once the plugin is installed, Claude will be able to choose to use Archival when you ask it to build websites, so you can just ask for something like:

Build me a site where I can post weekly album reviews.

If you want to bootstrap straight to making a new site, just use /archival:new.

Working in a folder

In Claude Code, the plugin notices when you're in a folder and works there instead of in the chat. It installs the archival CLI, creates the site — or finds the one already in the folder — and checks every change with archival build before showing you anything. Images and other files go up with archival login and archival upload, so they're served from the CDN rather than committed.

For a brand-new site it still publishes one preview and gives you the link, because that link is how you claim the site. Once you've claimed it, Claude connects the folder to your site's git remote at git.archival.dev/<your domain>, and from then on git push is the deploy: no preview, no publish step, just a commit. A site you already have works the same way — ask for it by name and Claude clones it into a folder and gets to work. A folder that already holds an Archival site gets /archival:site.

In a chat, or anywhere Claude has no shell, the MCP connector builds straight to a preview.

Editing your sites from Claude

The connector can also work on the sites you already have, in any Claude chat or in Claude Duet. Ask for something like:

Add a post to example.com about this weekend's show.

The first time Claude reaches for one of your sites, it shows a Connect button. That takes you to Archival to sign in and approve, then sends you back to the conversation, which picks up where it left off. Claude can reach every site you own or collaborate on, with the same access you have in the editor.

When Claude opens a site it gets an editing session: Archival's own editor, running on our side, with Claude at the controls. It edits your content and templates the way the editor does, so every change is checked against your site's object definitions, the site is rebuilt after each one, and a change that breaks the build says so straight away. Secret fields stay sealed: Claude can see that one is set, never what it holds.

Each session has a private preview link showing your site with Claude's changes applied. Claude can open it, take screenshots of pages at desktop and phone widths to check its work, and share the link with you so you can look before anything goes live.

Nothing changes on your site until Claude publishes, and Claude asks before it does. A publish is one commit that deploys the whole change at once. It shows up in your site's history like any other edit, change by change, so you can see what was done and revert it from the editor. If you or a collaborator published something in the meantime, the session brings it in first and tells Claude about anything that conflicts.

A session nobody has used for a week is deleted, along with any changes in it that were never published.

Signed in, Claude also skips the link-and-code step when it starts a new preview.

To disconnect Claude, go to your account page in the editor and use Connected apps. It has to ask you again before it can reach your sites.

Or build something from scratch

Build with Archival

Two steps and you're building

  1. Add the Archival connector

    Once, for your Claude account — it's how Claude builds and publishes your site. The link fills in the name and URL for you.

    When it asks about tool permissions, choose Always allow

    Add the connector
  2. Open Claude

    We'll reserve a preview for you and hand Claude a prompt that carries everything it needs.

    Open Claude in your browser