Where to Host an Exported Claude Artifact

When a Claude artifact needs a host of its own

An artifact is a page that Claude builds for you: a report, a dashboard, a small interactive tool or a single-page site. Claude keeps two kinds of artifacts on claude.ai: artifacts from claude.ai chats, and artifacts that Claude Code publishes from a session. You can share both kinds. If claude.ai sharing does not fit the audience or the job, move the artifact to your own host.

What claude.ai sharing gives you today:

• Chat artifacts start private. You share them with Share and Who has access. According to Anthropic’s sharing guide, anyone who opens a shared artifact generally needs a Claude account, even with the link. The exception is a chat artifact made before September 16, 2026 and published from the chat.
• Claude Code artifacts also start private. Your plan sets the sharing choices. You can share them with people in your organization, or publish a public link that opens without a claude.ai sign-in. On Team and Enterprise plans, public sharing stays off until an Owner turns on External sharing (Claude Code artifacts docs).
• A Claude Code artifact is one self-contained page. It has no backend, and it cannot serve several routes. Relative links in it do not work. A strict content security policy (browser rules for what a page can load) blocks external images and most external scripts.

If you need one of these items, host the exported files somewhere else:

Need	Claude artifact sharing	Separate static host
Visitors without Claude accounts	Only through public links where your plan and organization allow them	Yes
Your own domain	No	Yes
Sign-in for named outside people, such as a client’s team	Viewers sign in to Claude	Email codes through Cloudflare Access, or a site password on Netlify or Vercel
Several pages, real file paths, external images	One page, with images embedded in the page	Yes
A copy that stays after you unshare or delete the artifact	No	Yes

If all of your audience is inside your Claude organization, the artifact on claude.ai can be enough. The rest of this guide tells you how to move the artifact out.

Step 1: Find what the artifact depends on

You can move a plain page as it is. Features that run through claude.ai do not move with it. Anthropic’s artifacts overview describes three of them: artifacts that call Claude, saved storage, and connected apps.

Feature in the artifact	Works on a static host?	What to do
HTML, CSS, JavaScript, charts, sliders, tabs	Yes	Export as is
Libraries loaded from cdnjs, jsDelivr or unpkg	Yes	Keep the script tags, or save local copies of the files
Images embedded in the page as data URIs	Yes	If you want a smaller page, move them to separate files
Calls to Claude (the artifact answers prompts)	No. On claude.ai these calls run on the viewer’s own Claude account and plan	Build a small backend that calls the Claude API and keeps your key on the server, or remove the feature
Saved storage (personal or shared data that stays between visits)	No	Use localStorage for the state of one browser, or a real database behind your own API
Connected apps or MCP connectors	No. On claude.ai each viewer uses their own connections	Pull the data in at export time, or add your own API
Download buttons built for the claude.ai viewer	Rework them	Use ordinary links to files that you deploy with the site

Ask Claude to list these for you: “List every feature in this artifact that depends on claude.ai: calls to Claude, saved storage, connectors, download controls. For each, propose a static replacement.” Then decide what to keep.

Step 2: Get the files out

From Claude Code

If you do not name a location, Claude Code writes the artifact page to an HTML or Markdown file in a temporary folder. This folder is outside your project. Claude Code then publishes the page. Ask Claude Code to save the page into your project instead:

Save this artifact as site/index.html in this project. Replace anything that only works on claude.ai with static equivalents, and keep all CSS and JavaScript working when the file is opened from disk.

For an artifact from an earlier session, give Claude Code the artifact URL, or select the artifact with /artifacts. Then ask Claude Code to save the page into the project in the same way.

From a claude.ai chat

For a chat artifact made before September 16, 2026, use the controls at the top of the artifact panel. With these controls, you can view, copy or download the code. For artifacts made from the Design template, select Export and choose standalone HTML or a .zip. Docs and Slides export to Word, PDF, PowerPoint and similar formats. Those are documents: share them as files, not as a website.

If the code is a component, not a page

Some artifacts are a React component, not a complete HTML file. Ask Claude to turn the component into a standalone index.html. Or ask for a small Vite project whose build output you deploy. Keep the project in a folder that you control, so that later changes start from the same files.

Step 3: Test it locally

Before you upload anything, open the folder on your own computer. A local web server behaves more like a host than a double-clicked file:

cd site
python3 -m http.server 8000

Then open http://localhost:8000 and make sure that:

• The browser console shows no missing files or blocked requests.
• Charts, filters and buttons work.
• Libraries load from their CDN or from local copies.
• The layout works in a narrow window.
• The files contain no API keys, private notes or customer data.

Step 4: Choose where the files will run

Provider	A practical use	Private access
Cloudflare Pages	Upload a finished folder through the dashboard or Wrangler	Email sign-in with Cloudflare Access
Netlify	Drag a folder into Netlify Drop, or deploy from a repository	Site password on Pro and Enterprise plans
GitHub Pages	A static project that you maintain in a GitHub repository	Public, except private publishing on GitHub Enterprise Cloud
Vercel	A project that you already deploy from Git or the Vercel CLI	Password Protection is a paid option on Pro

Step 5: Publish the finished folder

1. Run the project locally. Make sure that every page that you plan to share works.
2. If the project has a build step, create the production build. Keep the entry HTML file and its assets together.
3. Remove credentials, private notes and files that do not belong on the site.
4. Upload the output folder. On Cloudflare Pages, go to Workers & Pages > Create application > Get started > Drag and drop your files. Name the project and select Deploy site. On Netlify, drag the folder into the deploy zone at app.netlify.com/drop.
5. Open the hosted address in a fresh browser session. Make sure that navigation, images and downloads work, and that a direct link to a nested page opens.
6. Deploy later changes to the same project, so that the address stays the same. Keep a copy of the previous working release.

A static upload does not reproduce a database, a server process or the sign-in of another platform. If Step 1 found features like that, deploy the backend separately before you share the site.

Step 6: Control access and keep it current

If the page is private, set up access before you send the link. See our guides for Cloudflare Pages, Netlify and Vercel.

The exported copy does not follow later edits in Claude. Use this routine to keep the two copies the same:

1. While the work is internal, continue to make changes in Claude Code or in the chat.
2. When a version is ready for outside people, save it into the project folder.
3. Test the version locally. Then deploy it to the same host project.
4. When the hosted copy replaces the artifact, unshare or delete the artifact. In Claude Code, run /artifacts. To delete an artifact that you own, select it and press d. Its link then stops working for everyone. To find public copies that search engines found, see Find Public Claude Artifacts in Google and Unpublish.

Mistakes to avoid

Mistake	What happens	Better approach
You copy only the visible text	You lose the charts and controls	Export the full HTML, or the project folder
You leave calls to Claude in the page	Buttons fail silently on the new host	Replace them with your own backend, or remove them
You put an API key in the page to replace those calls	Anyone can read the key in the browser	Keep keys on a server that you control
You expect saved data to move	Records stay behind on claude.ai	Export the data, or start fresh with your own storage
You share the old artifact and the new site side by side	People see two versions	Unshare the artifact after the hosted copy is live

A docs portal with Ask AI
and support tickets

Connect a repository, or describe your product to start. Each docs site has search, Ask AI, an API console, an MCP server and support tickets.

• Publishes from GitHub on every push
• Works with Mintlify repositories
• API console from your OpenAPI file
• MCP server and llms.txt for AI agents
• Ask AI and support tickets
• Analytics for people and AI agents

Start Free→ Questions? Ask AI in our docs

No card required.