Claude Artifact & JSX Viewer

Copy the artifact's code — in Claude, open the artifact and switch to the code view — then paste it into the viewer above. It compiles the JSX in your browser, loads React and the libraries the artifact imports, and runs it, so you see the same component working outside the chat. From there, Download .html saves a single file that runs it anywhere with an internet connection: open it in any browser, attach it, or host it. The file carries your code and loads React, Tailwind and the other libraries from public CDNs when it opens, which is what keeps it to one file rather than a folder of build output you would have to set up.

The ones Claude's artifacts use most. React and its hooks, Tailwind's utility classes, lucide-react icons and recharts charts load directly. The shadcn/ui components artifacts import from @/components/ui — Card, Button, Input, Tabs, Select, Slider, Switch, Alert, Badge, Dialog, Accordion, Table and a few more — are replaced with lightweight stand-ins that take the same props and look close to the originals, so the layout and behaviour hold even where the styling differs slightly. Any other npm package the artifact imports, such as lodash, d3 or mathjs, is fetched from esm.sh automatically. What cannot load is a file the artifact imports by a relative path, because that file only exists in Claude.

Usually because it relies on something only Claude provides. Artifacts that call Claude itself through window.claude.complete, read a file you uploaded to the chat through window.fs, or save data with Claude's persistent storage all stop at that call, because none of those exist outside Claude's own runtime — the viewer says which one it found rather than failing silently. The next most common cause is a missing export default: the component the viewer runs is the one the code exports as its default. If the code does not compile, the error box shows the line the compiler stopped at. And if nothing loads at all, check your connection, since React and the libraries come from a CDN.

No. The code you paste is compiled and run inside your own browser, in a sandboxed frame that cannot reach this site's cookies or storage, and it is not sent to pagegoat or stored after you close the tab. The page does make requests to public CDNs — esm.sh for React and the libraries, and Tailwind's CDN for styling — because that is where the libraries come from, and those requests fetch the libraries, not your code. The only way your artifact leaves your browser is if you choose Get a free link, which puts the finished HTML file online as a short-lived public link, or the paid upload, which puts it in your account after you sign in, or if you download it and send the file yourself.

Paste it above and press Download .html. The file you get holds your artifact's code, compiles it when it opens, and loads React, Tailwind and the other libraries from public CDNs, so it runs by double-clicking it on any computer with an internet connection, with no npm, no build step and no project to set up. That is the same file the preview shows, so what you checked here is what you send. It is also exactly the shape an HTML host expects: drop it on any static host, use Get a free link for a short-lived public link, or take it into the paid upload to put it online privately. The one requirement it keeps is a connection, since the libraries are fetched when it loads rather than bundled into it.

Claude's own Publish button only makes public links, and Team and Enterprise plans cannot publish publicly at all, so the private route is to host the artifact somewhere that checks who is opening it. Get a permanent link, under the viewer, takes the working HTML file this viewer builds straight into pagegoat's upload, where you can put it behind a password, limit it to people you name by email, or ask each visitor to confirm their email first — checked on the server before the page is sent. Your readers need no Claude account, and they can comment on the exact part of the page they mean. Hosting starts at $2.99 a month; if public is fine, Claude's own Publish button is free.