Advanced

Claude Artifacts: Interactive Mini-Apps You Can Build and Share

Artifacts turn a chat into a shareable mini-app — a searchable handbook, a data explorer, even a game. Here's what artifacts are, three worked examples, and the safety guidance.

Artifacts are Claude’s answer to a specific problem: you’ve built something useful in a conversation — a policy lookup, a data explorer, a template — and now you want to hand it to colleagues who have no interest in learning AI themselves. Artifacts let you package that thing as a mini-app, publish it to a URL, and share it.

They’re not technically part of Cowork. They live in the regular Chat product. But they’re worth a dedicated module because most people don’t know about them, and they quietly solve a real problem that used to require an engineer and a week.

What an artifact actually is

An artifact is a small interactive component — usually a webpage or a React app — that Claude generates inside a chat and renders in a side panel. Three things make them different from just “Claude writing code”:

  1. They run, right there in the conversation. You don’t have to copy, paste, or deploy.
  2. They can hold data. A searchable handbook carries the handbook’s text. A data explorer carries the dataset.
  3. They can be published. One click gives you a public URL you can share, or a team URL if you’re on a Teams plan.

Think of them as the feature custom GPTs were supposed to be — packaged tools one person builds and everyone else uses.

Before you start: flip the toggles

In Settings → Capabilities, make sure these are on:

  1. AI-powered artifacts
  2. Visualizations
  3. Any related visualization toggles

If the toggles are off, Claude will write code in the chat body instead of building a real artifact, and you’ll wonder why the side panel never appeared.

Also: say the words “create an interactive artifact” in your prompt. Without it, Claude often guesses wrong and hands you a code block.

Example 1: An interactive employee handbook

You have a 30-page PDF employee handbook. Nobody reads it. You can turn it into a searchable chatbot in one prompt.

Upload the PDF to the chat, then:

Create an interactive artifact that takes this PDF
and turns it into a shareable chatbot. Employees
should be able to ask questions about the policies.
If an answer isn't in the PDF, say "I don't know"
rather than guessing. Include three example
conversation starters so people know what to ask.

What happens. Claude writes the React code for a little chat interface, pre-loads the handbook content, and renders it in the side panel. You can ask it questions right there — “what’s the vacation policy,” “do we have a Slack emoji policy” — and it answers from the actual handbook.

Publish it. Top-right of the artifact panel, click Publish. You’ll see two options:

  • Public — anyone with the link.
  • Team — only members of your Teams plan.

Copy the link, drop it in Slack or email, and you’re done. Colleagues open a URL, ask questions, get answers. They never touch Claude.

Example 2: A data visualization explorer

Spreadsheets are bad at showing shape and correlation. Artifacts are good at it.

Upload a CSV — say, a few columns of housing data (housing starts, permits, S&P 500 level, homebuilder ETF) pulled from the FRED database.

Prompt:

Create an interactive data visualization as a
Claude artifact using this CSV. Let me toggle
between time series, correlation matrix, normalized
performance, and rolling statistics. Include the
analyses that would be useful to a stock investor
looking at housing-sensitive names.

What happens. Claude builds a small dashboard with tabs for each view. You can flip between a correlation matrix (housing permits vs. the homebuilder ETF is weaker than you’d expect), a normalized performance chart, rolling stats over 12 months, and so on. You can edit colors, and you can download the underlying code as a single file.

This is a real substitute for “I need to ship a prototype dashboard tonight” scenarios. The output is one HTML/JavaScript file you can host anywhere.

Example 3: Games (and why this matters for motivation)

A less serious but genuinely useful example: ask for a game.

Create an interactive artifact that is the original
Tetris game.

Claude will produce a playable Tetris in the side panel. Controls usually: arrows to move, spacebar to drop, enter to rotate.

Why mention this in a course for professionals? Because this is the single best way to get a skeptical family member — a partner, a teenager — to see what AI can do. A working game in two minutes lands in a way that a synthesized research report doesn’t. Lots of knowledge workers get their first hands-on co-creation moment this way, then go back to real work with a different mental model.

The serious side: what to build for real work

Once the mechanics click, the professional use cases get obvious:

  • Searchable internal documents — employee handbooks, onboarding guides, compliance procedures.
  • Data explorers — dashboards over a spreadsheet you refresh weekly.
  • Calculators — pricing tools, mortgage calculators, risk estimators built from your firm’s logic.
  • Training walkthroughs — step-by-step interactive guides for new hires.
  • Client-facing mini-tools — a quote generator, a property match tool, a course recommender.

The pattern is the same: take something that is currently a PDF, a spreadsheet, or a long Slack thread, and turn it into a thing people can actually use.

Publishing safely

Two things to be careful about:

  1. Public vs team. “Publish to web” is public. If your artifact has any internal data in it — employee handbook contents, client names, internal numbers — publish to Team (requires a Teams plan) or keep it unpublished and just use it in-chat.
  2. Nothing privileged. Don’t build artifacts with regulated data (PHI, financial account numbers, privileged legal work product) unless your firm has explicitly approved Claude for those workflows.

When in doubt: keep it unpublished. An unpublished artifact still works — you can use it in the chat where you built it, come back to it later, and even bookmark the chat. You only need publishing when you’re handing it off.

Common mistakes

  • Skipping “create an interactive artifact” in the prompt. You’ll get a code snippet, not a running app.
  • Forgetting to turn on the capability toggles. The side panel just won’t appear.
  • Publishing something with confidential info. The public URL is, well, public.
  • Treating artifacts as full software. They’re great prototypes and small internal tools. They are not a replacement for a real engineering project if the tool has to scale.
  • Not downloading the code. If the artifact matters, download the file so you have it if anything changes upstream.

A word on what this replaces

Ten years ago, the “turn this PDF into a searchable thing” task meant hiring a developer and paying for hosting. Five years ago it meant a no-code tool, a weekend, and a $50/month subscription. Now it’s a paragraph of prose. That compression is going to keep happening. Artifacts are a good place to feel it firsthand.

Next up

Next module: the skill-creator skill. A deeper walkthrough of how to actually build a production-grade skill — research analyzer, style guide, inbox triage — not the dad-joke demo from the skills intro.

Frequently asked questions

What is a Claude artifact?

A small interactive app Claude builds inside a chat — usually a webpage or React component. It renders right in the conversation, can be published to a public URL, and shared with colleagues who never need to use Claude themselves.

Are artifacts part of Cowork?

No, artifacts live in the regular Chat product, not Cowork. They're worth knowing because they solve the 'package this for a teammate' problem. Most of this course is Cowork, but artifacts are a small, high-leverage detour.

Is my data safe when I publish an artifact?

A published artifact is a public URL — anyone with the link can view it. If your artifact contains confidential data (employee handbook, client info, internal numbers), use the Teams plan and publish only to your team, or don't publish at all and just use it in-chat.

Do I need to know React to build one?

No. You describe what you want; Claude writes the code. You can download the file if you want to host it yourself or hand it to an engineer, but for the 90% case you just use the hosted version.

Why did my artifact not appear?

Check Settings → Capabilities and make sure 'AI-powered artifacts' and the visualization toggles are on. Also, include the phrase 'create an interactive artifact' explicitly in your prompt — without it, Claude often gives you a code snippet instead.

Get the free Cowork Insider playbook

The 20-minute step-by-step guide for non-technical professionals. Delivered by email.

No spam. Unsubscribe anytime.