Claude Artifacts: How to Share One as a Web Page
Claude artifacts are pages, apps and documents that Claude creates in a panel beside the chat. You can share one by publishing it from Claude, which gives a public link. If you want the page outside Claude, under an address you choose, copy its HTML and host it elsewhere, for example by pasting it into HTMLpad.
AI assistants have made a lot of people the owner of an HTML file without meaning to. Ask Claude for a landing page, a calculator or a one-page report, and the result often appears as an artifact: a working page you can click and scroll right in the conversation. The next question is almost always how to show it to someone else.
What a Claude artifact is
An artifact is a self-contained piece of output that Claude displays in its own panel rather than in the chat text: a web page, an interactive tool, a diagram, a document. Web page artifacts are usually a single HTML file with the styles and scripts inside, which is what makes them easy to move around.
Route 1: publish it from Claude
Claude has its own publishing option, which Simon Willison described when it first appeared. According to Anthropic's help centre, on the Free, Pro and Max plans you can publish an artifact, and anyone with the link can view and interact with it, without needing a Claude account.
A few details are worth knowing:
- Viewers can "Customize". Claude users who open your published artifact can open a copy in their own conversation and change it. Your original stays as it is.
- Team and Enterprise work differently. On those plans, artifacts are shared within the organisation, and viewers sign in to see them, rather than published to the public.
- Unpublishing is final. Once unpublished, an artifact cannot be republished; you would create a new one.
- Embedding is possible. You can get an embed code and list the domains allowed to embed it.
This route is ideal when you are happy for the page to live on Claude, under Claude's address, and for viewers to see it as something made with Claude.
Route 2: copy the HTML and host it yourself
Sometimes you want the page to stand on its own: your address, no AI branding around it, and the freedom to edit it in any tool. Then take the code out of Claude.
- Open the artifact and view its code. Copy the full HTML.
- Check it is complete. Web artifacts are usually one file. If the code refers to separate files, ask Claude to put everything into a single HTML file.
- Paste it into HTMLpad. The live preview shows whether it works outside Claude.
- Choose an address and save. You get a link such as
HTMLpad.org/pricing-calculator/.
From then on you can edit the page in HTMLpad's editor or back in Claude, and paste the new version over the old one.
Things that can break when you move an artifact
Most HTML artifacts move without trouble. A few kinds need attention.
Artifacts that call Claude. Some interactive artifacts use Claude's own capabilities while they run, for example a tool that answers questions with AI. Those features depend on Claude and will not work as plain HTML elsewhere.
React or code-only artifacts. If the artifact is written as a component rather than a complete HTML page, it needs Claude's environment to run. Ask Claude to convert it into a standalone HTML file first.
Placeholder content. Read the text before you publish anywhere. AI-generated pages sometimes include sample names, invented prices or dummy email addresses.
Which route should you choose?
| You want... | Use |
|---|---|
| The quickest public link, fine living on Claude | Publish from Claude |
| Your own address, no AI frame, edit anywhere | Copy the HTML into HTMLpad |
| A permanent page on your own domain | Copy the HTML to a static host such as GitHub Pages |
The same logic applies to pages from ChatGPT or Gemini: if you get a single HTML file, any of the routes in how to host an HTML file will work. And if you are not sure what you are looking at, start with what an HTML file is.
Frequently asked questions
Can people without Claude see my published artifact?
Yes. Anthropic's help centre says people without an account can view and interact with a published artifact. They are only asked to sign up for features such as customising it.
Can I put a Claude artifact on my own website?
Yes, in two ways. You can embed the published artifact using the embed code Claude provides, or copy its HTML and host it yourself, on HTMLpad, a static host or your own site.
Why does my artifact not work after I copy it?
Usually because it depends on Claude: it calls Claude's AI features, or it is a code component rather than a full HTML page. Ask Claude to turn it into a single standalone HTML file without AI features, then try again.
Do I own the HTML Claude generates?
That is a question about Anthropic's consumer terms, which set out who owns outputs and how you may use them. Read the current terms for your plan before you publish anything commercially.