Source: wiki synthesis: cowork-live-artifacts, nate-herk-every-level-of-claude, 04-projects-files-artifacts
Artifacts are the right-hand side panel on claude.ai where Claude renders structured output — code, documents, HTML pages, React components, SVGs, diagrams — as a live, persistent object you can iterate on without losing chat context. The recent upgrade (persistent storage + API access + public sharable links) elevates Artifacts from “ephemeral side-panel” to a first-class primitive: build a customer-feedback tracker in chat, save it, send a public link — “no Lovable, no Bolt, no custom development, just a conversation.”^[inferred]
Key Takeaways
- Artifacts are the structured-output canvas. When you ask Claude for something structured (table, doc, code, mockup, dashboard), it opens an Artifact pane on the right where output is rendered, editable, and iteratable separately from the conversation.
- The persistent-storage + API-access upgrade is the unlock. Previously Artifacts lived only inside a single chat. Now they save as standalone objects, can call APIs from inside the artifact (Connectors, custom MCPs), and refresh data on each open — turning one-shot canvases into durable mini-apps.^[inferred]
- Sharable public links ship Artifacts as products. Build it in chat, hit save, send a URL. The receiver doesn’t need a Claude account to view it. This is what makes Artifacts the “Level 2 cheat code” in Nate Herk’s 5-level framework — non-coders can ship working frontends without touching Lovable, Bolt, or custom code.
- Distinct from inline rendered output. Charts and diagrams built directly inside the chat thread are ephemeral — they live in the conversation, don’t save as files, and don’t get their own URL. Artifacts are persistent and addressable. Both exist; both have separate UI affordances.
- Cowork Live Artifacts extend the primitive. In Claude Cowork, Artifacts gain Connector access (pull from Notion, Calendar, Stripe, HubSpot, custom MCPs for GSC/GA) and become pinned dashboards that refresh on demand — see Eliot Prince’s 7-recipe walkthrough.
- Versioning is automatic. Every refresh saves a previous run; scroll back through historical states without manual snapshotting.^[inferred]
- No-code by design. “You don’t need to know how to code to do this” — Claude writes the underlying HTML/React/SVG, the operator just edits the prompt inputs.
- Artifacts now in Claude Code (beta, 2026-06-18). [X signal — @claudeai / @ClaudeDevs / @trq212] Claude Code sessions can generate interactive, live-updating pages — e.g., a PR walkthrough or a living project dashboard — shareable with teammates (or “other Claudes”) via a private link. Beta on Team and Enterprise plans, with Pro/Max “coming soon.” This extends the Artifacts primitive from claude.ai chat / Cowork to the coding surface: the artifact is built from your Claude Code session rather than a chat thread. (Sources:
raw/x-account-claudedevs-2067672094209675373.md,raw/x-bookmarks-recent-digest-2026-06-19.md; https://x.com/claudeai/status/2067671912038240487.)
What Artifacts can be
- React components — interactive UI, state management, embedded logic.
- HTML pages — single-file landing pages, dashboards, mockups, microsites.
- SVGs — vector graphics, diagrams, icon sets, custom illustrations.
- Code snippets — any language; syntax-highlighted, copyable, runnable in-pane where supported.
- Documents — long-form markdown rendered as styled prose; iteratable section-by-section.
- Diagrams — Mermaid / flowcharts / architecture maps rendered as persistent objects (distinct from ephemeral inline diagrams).^[inferred]
- Mini-apps — with the persistent-storage + API-access upgrade, an Artifact can be a customer-feedback tracker, a quote calculator, a personal CRM view — anything that needs durable state and an addressable URL.
Artifacts vs inline rendered output (charts/diagrams)
| Surface | Lifetime | Storage | Shareable URL | UI affordance |
|---|---|---|---|---|
| Artifact | Persistent across sessions | Saved as a standalone object | Yes (public link) | Right-hand side panel, editable in place |
| Inline visual (charts, diagrams inside chat) | Ephemeral — lives in the conversation | Not saved as a file | No | Rendered inline in chat thread; click to swap chart type, ask Claude to add variables, drop in CSVs |
Both are useful; the choice depends on whether the output needs to outlive the conversation. Inline visuals are the right call for one-shot exploration (“show me this data as a bar chart, now as a line chart”). Artifacts are the right call for anything you want to share, return to, or treat as a deliverable.^[inferred] Inline visuals are free on every plan; Artifacts with persistent storage are paid-tier (see Nate Herk Level 2 for the free-vs-paid split).
Related
- cowork-live-artifacts — canonical deep-dive on Live Artifacts in Cowork (7 dashboard recipes, Connector integration)
- nate-herk-every-level-of-claude — Level 2 framing: Artifacts as the cheat code that lets non-coders ship working frontends
- 04-projects-files-artifacts — onboarding-level explanation alongside Memory + Projects
- claude-design — sister design primitive; handoff bundle pairs with Artifacts for end-to-end shipping
- Claude Projects — the context spine that wraps Artifact-bearing chats
- Cowork — Getting Started — Cowork is where Artifacts gain Connector + custom-MCP reach
Try It
- Build one persistent Artifact. Open a new claude.ai chat (Pro or above) and ask: “Build me a simple customer-feedback tracker as an Artifact — name, email, feedback, date. Save it and give me a public link.” Watch the Artifact pane open, then copy the share URL.
- Compare inline vs Artifact. In one chat, ask Claude to “show me last quarter’s revenue as a bar chart” (inline). In another, ask for the same data “as an Artifact dashboard I can share.” Note the difference in lifetime and UI.
- Graduate to Cowork Live Artifacts. Follow the 7-recipe walkthrough — pick the dashboard matching your most painful daily tool-hop (morning command center, sales pulse, support pulse) and pin it to your Cowork sidebar.