Updated Oct 17, 2026

## How do I share an HTML page I made with AI?

Save the AI's output as one .html file, upload it here, and copy the link. The page renders live in a sandboxed browser view, so anyone you send it to sees the working page, not code. If your AI tool produced a whole project, build it and publish the output folder as a ZIP website instead.

### One file is free on every plan

Most chat tools give you a single page: a dashboard, a calculator, a quiz, a landing mockup. Upload that one .html and it becomes a link on the Free plan too, up to 250 MB per file.

[HTML hosting](https://linkinseconds.com/html-hosting)

### Whole AI-built apps as a website

Lovable, Bolt and v0 usually produce a full project, not one file. Build it, zip the output folder (dist/ or out/), and publish it with website hosting on Pro, with every route and asset served.

[Deploy a Vite or React build](https://linkinseconds.com/deploy-vite-react-build)

### Let Claude or Cursor publish it for you

Connect our MCP server to Claude Code, Cursor or VS Code and ask: "publish this page as a link". The assistant uploads the file to your account and replies with the URL.

[MCP server docs](https://linkinseconds.com/docs/mcp)

### Safe to open, for you and for them

Generated code is shown in a sandboxed frame without same-origin access, so it can't read anyone's cookies. Every upload is type-checked by its real bytes and scanned before it goes public.

### What to check before you share

React code is not HTML yet. A .jsx or .tsx component from a chat won't run on its own; ask the AI for one self-contained HTML file, or build the project and publish the output.

Saved data may not persist. A single HTML link runs sandboxed, so code that relies on localStorage or cookies (a to-do list that remembers items) may not save between visits.

No server and no secrets. Static hosting serves files only; never paste an API key into the HTML, because anyone who opens the link can read it.

## How it works

- 1 ### Get one self-contained .html file Copy or download the code from Claude, ChatGPT, Gemini or your editor and save it as index.html. If the AI split it into several files or wrote a React component, ask it for a single HTML file with the CSS and JavaScript inline.

- 2 ### Upload it and sign in Drag the file onto the card and sign in with Google. The file is checked by its real bytes and scanned, free up to 250 MB and 500 MB on Pro. A built app goes up as a ZIP through website hosting on Pro.

- 3 ### Open the link, then share it Open your link once to check the page works, then send the URL or its QR code. Add a password or an expiry date if you like, and watch the view count to see when it was opened.

## Claude artifacts: save the page as one HTML file

When Claude builds a page, it shows it as an artifact next to the chat. Open the artifact and use its copy or download option to get the code, then save it as a file ending in .html (for example index.html). Check which kind of artifact you have. An HTML artifact is ready to upload as it is. A React artifact is a component, not a page, so it will not run on its own; ask Claude to "rewrite this as one self-contained HTML file with the CSS and JavaScript inline, loading any libraries from a CDN" and save that version. Then drag the .html onto the uploader, sign in, and copy your link. If you use Claude Code instead of the chat, the file is already on your disk, and with our MCP server connected Claude can publish it and hand you the link in the same conversation.

## ChatGPT canvas and Gemini: copy the code into a file

ChatGPT and Gemini can both write and preview web pages in a side panel. The simplest reliable route is the same for both: copy the full code, paste it into a plain text editor (Notepad, TextEdit in plain-text mode, VS Code), and save it as index.html. Before you copy, ask the assistant to "put everything in a single HTML file", because answers sometimes split the CSS and JavaScript into separate blocks, and a lone .html cannot load files that sit next to it. Images work when they point to full https:// addresses or are embedded as data URIs. Open the saved file in your own browser once; if it looks right there, it will look right at the link. Upload it, and the person you send it to gets the working page, with no ChatGPT or Gemini account needed to view it.

## Lovable and Bolt: build the project, then publish the folder

App builders such as Lovable and Bolt generate a full front-end project, typically React with Vite, rather than one HTML file. Uploading the source will not work, because the browser needs the built output. Get the code out first: sync the project to GitHub or download it, depending on what your tool offers. Then, on your computer, run npm install and npm run build. That creates a dist/ folder with an index.html and the bundled JavaScript and CSS. Zip that folder and publish it with website hosting, which needs Pro: we find the index.html, serve every asset with the right type, and can fall back to index.html for client-side routes so refreshes and deep links work. If the app talks to a hosted backend such as Supabase from the browser, those HTTPS calls keep working, as long as that service accepts requests and sign-in redirects from your new address, so add the new URL to its allowed list.

## v0 by Vercel: plain HTML for a mockup, a static export for an app

v0 usually generates React components built for Next.js. You have two honest options. For a quick mockup or a landing page you only want people to look at, ask v0 for "a single static HTML file using Tailwind from a CDN", save it as index.html, and upload it as a normal link. For a real app, download the code and run it locally. If the app has no server features, set output: 'export' in next.config, run the build, and Next.js writes a static out/ folder you can zip and publish as a website on Pro. If it relies on API routes, server actions or per-request rendering, it needs a platform that runs a Node server, and static hosting is the wrong fit; we would rather tell you that than take the upload.

## Cursor, Codex and Claude Code: publish straight from your editor

Coding agents write real files, so there is nothing to copy out. A single report.html or demo.html in your project can be dragged onto the uploader as it is. A project with a build step works like Lovable: run the build and publish the output folder as a ZIP website on Pro. The faster path is our MCP server. Add it to Claude Code with one command, or to Cursor and VS Code through their MCP config, using an API key from your dashboard. Then ask the agent to "build a one-page summary of this data as HTML and publish it as a link", and it uploads the file through the same checks as the website and replies with the URL. The agent cannot change link settings or delete links; you keep that control in the dashboard.

## One HTML file or a ZIP website: which one you need

Count the files. If everything lives in one .html (styles in a <style> tag, scripts in a <script> tag, libraries from a CDN), publish it as a normal link: it works on every plan, up to 250 MB per file on Free and 500 MB on Pro, and it gets the full set of link controls, including a QR code, view analytics, a password, an expiry date and your own domain. If the page needs other files next to it (a second page, a /assets folder, a JavaScript bundle), it is a website, so zip the folder and publish it with website hosting on Pro. Either way, replacing the file or re-uploading the ZIP keeps the same link, so when the AI gives you a better version next week, nobody needs a new URL.

## Why the page runs in a sandbox, and what to ask your AI for

A single HTML link is shown inside a sandboxed frame without same-origin access. Scripts, forms, pop-ups and alert boxes still work, so charts, games, calculators and quizzes behave normally. What the sandbox blocks is access to storage and cookies tied to our site, which protects every visitor from code they did not write. In practice this matters for one common AI pattern: apps that save state in localStorage. If your generated to-do list or tracker needs to remember things, ask the AI to "keep state in memory and do not use localStorage" for the shared version. And because everything in a static page is visible to whoever opens it, never let the AI paste an API key or password into the HTML.

claude-artifact.htmlHTML

canvas-dashboard.htmlHTML

landing-v0.htmlHTML

quiz-game.htmlHTML

lovable-app.zipZIP

claude-artifact.htmlHTML

canvas-dashboard.htmlHTML

landing-v0.htmlHTML

quiz-game.htmlHTML

lovable-app.zipZIP

claude-artifact.htmlHTML

canvas-dashboard.htmlHTML

landing-v0.htmlHTML

quiz-game.htmlHTML

lovable-app.zipZIP

claude-artifact.htmlHTML

canvas-dashboard.htmlHTML

landing-v0.htmlHTML

quiz-game.htmlHTML

lovable-app.zipZIP

gemini-chart.htmlHTML

pitch-onepager.htmlHTML

calculator.htmlHTML

bolt-site.zipZIP

cursor-report.htmlHTML

gemini-chart.htmlHTML

pitch-onepager.htmlHTML

calculator.htmlHTML

bolt-site.zipZIP

cursor-report.htmlHTML

gemini-chart.htmlHTML

pitch-onepager.htmlHTML

calculator.htmlHTML

bolt-site.zipZIP

cursor-report.htmlHTML

gemini-chart.htmlHTML

pitch-onepager.htmlHTML

calculator.htmlHTML

bolt-site.zipZIP

cursor-report.htmlHTML

2,300+

people sharing files

4,500+

links shared

15,700+

times opened

Keep reading

[HTML hosting](https://linkinseconds.com/html-hosting)[Publish an HTML ZIP](https://linkinseconds.com/publish-html-zip)[Deploy a Vite or React build](https://linkinseconds.com/deploy-vite-react-build)[Host a static website](https://linkinseconds.com/host-static-website)[Publish from Claude or Cursor (MCP)](https://linkinseconds.com/docs/mcp)[Share an HTML file as a link](https://linkinseconds.com/blog/share-an-html-file-as-a-link)

Source: https://linkinseconds.com/host-ai-generated-html
