# Host a Claude artifact

Put a page Claude made online at its own address: paste the artifact's HTML, or let Claude publish it through the Lobsite connector. Free to try, no account.

On the web at https://lobsite.com/hosting/claude

```text
https://lobsite.com/api/mcp
```

The connector URL: add it to Claude as a custom connector and ask Claude to publish.

Claude writes a whole page in one artifact: a landing page, a quiz, a calculator, a report. To give it a home of its own, outside the chat, publish it on Lobsite: paste the artifact's code in the box above, or connect Lobsite to Claude and ask it to publish. Building in Claude Code instead? See [Deploy from Claude Code](https://lobsite.com/hosting/claude-code).

## How it works

1. **Get the artifact's code.** In the artifact panel, switch to the code view and copy it, or download the file.
2. **Paste it in the box above** and press **Publish this page**. You get a live `*.lobsite.app` address with HTTPS.
3. **Keep it.** The site lasts 6 hours; **Keep it free →** moves it to a free account at the same address.

## HTML artifacts and React artifacts

Claude makes artifacts of a few kinds, and it matters which one you have:

- **HTML artifacts** (a full page starting with `<!doctype html>`) publish as they are. Inline styles and scripts work, and so do libraries loaded from a CDN by their full URL.
- **React artifacts** (code that starts with `import` and `export default function`) aren't a web page yet: the artifact panel builds them for you. Ask Claude to turn it into a page, with a prompt like the one below, then paste the result.

```text
Rewrite this artifact as one self-contained index.html: plain HTML, CSS and
JavaScript, no build step, any libraries loaded from a CDN by full URL.
Keep the design and behaviour exactly the same.
```

Images Claude can't create as files (logos, photos) need a full `https://` URL, or put the page and the images in a folder and drop the folder in the **Drop files** tab.

## Let Claude publish it: the connector

Claude.ai can use Lobsite as a custom connector, a remote MCP server. Add a custom connector in Claude's settings with this URL:

```text
https://lobsite.com/api/mcp
```

Then ask: "Publish this page with Lobsite." Claude calls the connector's one tool, `deploy_files`, with the page's contents, and answers with the address and the claim link that keeps the site. Custom connectors are available on the Claude plans that support them; the [MCP page](https://lobsite.com/mcp) has the details for every client.

## Claude's own Publish button, or a site

Claude can share an artifact with its own **Publish** button. That's the quickest way to show someone the artifact inside Claude. A site is for when the page should stand on its own:

| | Claude's Publish | Lobsite |
|---|---|---|
| Where it opens | On claude.ai | At its own `*.lobsite.app` address |
| Your own files (images, more pages) | No | Yes: drop the folder |
| Forms that send you messages | No | Yes, once the site is in an account |
| Updates | Publish the new version from Claude | Paste again and press Update, or redeploy |
| Custom domain | No | Paid plan, coming soon |
| Needs an account | Your Claude account | No for 6 hours; free to keep |

## Frequently asked questions

### Can I host a Claude artifact for free?

Yes. Publishing is free without an account and lasts 6 hours. A free Lobsite account keeps one site for good, with 10 GB of bandwidth a month.

### Why is my published artifact a blank page?

It's most likely a React artifact: its code needs a build that the artifact panel does for you. Ask Claude to rewrite it as a single self-contained HTML file (the prompt is above), then publish that.

### Do I need the connector?

No. Copying the code and pasting it here works on any Claude plan. The connector saves the copy and paste, and lets Claude update the site as you keep changing the page.

### Can people find my page on Google?

Not while it's temporary: sites without an account aren't indexed. Once you keep it in a free account, search engines can index it.

### Can I add a contact form to the page?

Yes. Ask Claude to make the form post to `/_lobsite/forms/contact`. Messages reach your dashboard's inbox and your email once the site is in your account. See [forms](https://lobsite.com/features/forms).