Claude Code Artifacts: Share Live Pages From Your Session

Anthropic launched Claude Code Artifacts on June 18, a beta feature that turns coding sessions into shareable, live web pages. The tool publishes HTML pages to private URLs on claude.ai that update in real time, allowing teams to view session output without pasting terminal logs into Slack. Artifacts are limited to Team and Enterprise plans, require the Anthropic API, and block external requests for security.

Claude Code shipped Artifacts on June 18 — a beta that turns your coding session into a shareable, live web page. You ask for one, Claude publishes an HTML page to a private URL on claude.ai, and it updates in place as the session continues. Share the link with your team and they see exactly what you see, refreshing in real time. The pitch is simple: stop pasting walls of terminal output into Slack to explain what just happened. The same tool writing your code can now write the document that explains it — and keep it current while it works. What It Actually Does When you ask Claude Code for an artifact, it writes a .html or .md file to your project, then asks permission to publish: “Claude wants to publish ‘Deploy failures by service’ to a private page on claude.ai.” Hit yes, and you get a permanent URL that doesn’t change on subsequent updates. Each publish is versioned; you pick which version teammates see from the page header. The pages are served under a strict Content Security Policy that blocks all external requests. No CDN, no fonts from Google, no fetch calls at view time. Claude inlines everything — CSS, JavaScript, images as data URIs. This is by design. An artifact is a capture of work, not a live app. There’s no backend, no form storage, no API round-trips when someone loads the page. What makes this more interesting than “Claude writes HTML” is session context. An artifact pulls from everything your session can reach: your codebase, data pulled through connected MCP servers https://code.claude.com/docs/en/mcp , and the full conversation. An incident timeline that includes actual error metrics from your monitoring connector — not a reconstructed approximation, but data Claude fetched through the tool — is different from one you’d assemble manually. The Prompts That Work These prompt patterns cover the most common uses: PR walkthrough — annotated diffs reviewers can actually follow: Make an artifact that walks through this PR. Render the diff with margin annotations and color-code findings by severity. Living incident page — grows as you investigate, becomes the postmortem: Build a dashboard artifact of last week's deploy failures by service and keep it updated as you investigate. Side-by-side comparison — layouts, API shapes, implementation options: Make an artifact with four different layouts for the settings panel. Vary density and grouping, lay them out as a grid with a one-line tradeoff under each. Interactive scratchpad — sliders and toggles bound to what you’re tuning: Build an artifact with sliders for easing curve, duration, and delay so I can try values on this animation. Show it live as I move them. Triage board with export — draggable cards that hand results back to your session: Make a triage board artifact with open issues as draggable cards across Now, Next, Later, Cut. Add a "Copy as prompt" button to paste the final ordering back here. Press Ctrl+ at any time to reopen the most recent artifact from the terminal. Set CLAUDE CODE ARTIFACT AUTO OPEN=0 if you don’t want the browser to open automatically on each publish. What It Is Not Artifacts are not an app builder. The constraint list is worth reading before you get too excited: No backend. The page can’t call an API at view time, store form input, or authenticate viewers. No public sharing. Viewers must be authenticated org members. There’s no way to send a link to someone outside your organization. Anthropic API only. If you run Claude Code against Amazon Bedrock https://aws.amazon.com/bedrock/ , Google Vertex AI, or Microsoft Foundry, artifacts don’t work. Team and Enterprise only. Free and Pro plans are out, at least for now. 16 MiB rendered page limit. Large raster images embedded as data URIs are the usual culprit when a publish fails. For comparison: Cursor’s Shared Canvases https://byteiota.com/cursor-shared-canvases-from-ide-to-team-dashboard/ lets teams collaborate on a live canvas. Artifacts take a different angle — they’re read-only for viewers, and the author stays in full control. One publishes, others read. Enterprise Controls On Team plans, artifacts are on by default. On Enterprise, an admin enables them under Settings Claude Code Capabilities . From there: Role-based scoping — grant the Artifacts permission to specific roles under Settings Roles Retention policies — set separate lifetimes for private and shared artifacts under Settings Data & privacy controls Audit log — publish, share, and delete actions appear as claude artifact events Compliance API — GET /v1/compliance/code/artifacts to list, DELETE /v1/compliance/code/artifacts/{id} to remove If your org restricts outbound traffic, allowlist .claudeusercontent.com — that’s where artifact viewer pages are served from. Design System Integration Claude applies its own design choices by default, but if you record design tokens in your project’s CLAUDE.md or a theme file, it uses those instead: Design system - Colors: primary 1a4d8f, accent f59e0b, surface f8fafc - Typography: Inter for body, JetBrains Mono for code - Spacing: 8px scale, 6px border radius This keeps artifacts visually consistent with your product — useful when you’re sharing them with stakeholders who associate your brand’s styling with quality. Check Availability First Before you try it: Team or Enterprise plan, signed in with /login not an API key or gateway token , Anthropic API as the provider, and no CMEK/HIPAA/Zero Data Retention policies active for your org. If any of those boxes aren’t checked, Claude writes a local HTML file instead of publishing. The full requirements list https://code.claude.com/docs/en/artifacts is in the docs. Artifacts are in beta as of June 18, 2026 — live now on Team and Enterprise plans https://claude.com/blog/artifacts-in-claude-code . No opt-in required. Just ask Claude for one.