CCA·v2.4
Claude 101
Creating with artifacts
note
1 · 6/14

Creating with artifacts

Creating with artifacts — hero
Diagram
Creating with artifacts — diagram

6. Creating with Artifacts

Course: Claude 101 Estimated time: 21 minutes

Learning objectives

By the end of this lesson, you will be able to:

  • Explain what artifacts are and when Claude creates them
  • Share artifacts with colleagues and publish them
  • Troubleshoot common artifact issues

What are artifacts?

Artifacts are standalone, interactive outputs that Claude creates in a dedicated window alongside your conversation. Instead of getting a big block of code or text buried in the chat, you get your content rendered and ready to use — whether that's a working website, an interactive chart, or a document you can immediately download.

Claude automatically creates an artifact when content meets certain criteria:

  • It's significant and self-contained (typically 15+ lines)
  • It's something you're likely to want to edit, iterate on, iterate on, or reuse
  • It represents a complete creation (not a sentence completing something else)
  • It's content you'd want to reference or use later

Artifact types

Claude can create different types of artifacts, each suited to different needs:

  • PowerPoint and Excel — Great for anything neat that you'd want to keep or continue editing — this includes reports, proposals, plans, graphs, and other written content
  • Code — Claude can generate code in any language and run it to test results and fix errors
  • HTML pages — Complete web pages with HTML, CSS, and JavaScript in a single file
  • SVG images — Scalable vector graphics for logos, icons, illustrations, and other visual elements
  • Mermaid diagrams — Flowcharts, sequence diagrams, Gantt charts, org charts, and more
  • React components — Interactive UI elements with full functionality — calculators, dashboards, games, data visualizations

Creating your first artifact

Creating an artifact is as simple as having a conversation. Just describe what you want, and Claude will determine whether to generate an artifact and of what type.

When Claude generates an artifact, it appears in the right panel of the Claude interface. You'll see:

  • Type different between Inspect (where a preview is shown) and the code from the right of your screen
  • You can copy the code to grab the controls for use elsewhere
  • Download the artifact as a file directly to your computer
  • View under the exactly what Claude processed

Sharing and publishing artifacts

When you've created something useful, you have several options for sharing it:

  • Copy or download for the artifact as a file to share directly
  • Share within your organisation (Claude for Work Team users can share artifacts across the shared artifact app). The shared artifact stays within your organisation and organisation-level sharing is across.
  • Publish publicly — For Pro, Pro Max, and Max users, you can publish artifacts to a public link. Anyone with the link can view and interact with the artifact. Publishing is optional.

Tips for getting the most from artifacts

  • Be specific about what you want: "Build a budget tracker" is good, but "Build a monthly budget tracker that shows income vs expenses by category with a split monthly breakdown, and get a warning when I'm over budget" is better
  • Describe the end-user: Telling Claude who will use it will help it make appropriate design decisions: "This flowchart is for new employees who don't know our jargon"
  • Iterate incrementally: Ask Claude to add one feature or make one change at a time, rather than requesting everything upfront
  • Request artifacts when needed: If you're expecting something substantial and Claude just gives you text, ask: "Please create an artifact for that"

Lesson reflection

Before moving on, consider:

  • Are there processes in your work that would benefit from having an interactive artifact you could reuse?
  • Are there processes or programs that would help you with a flowchart or blueprint?
  • What type of artifact would next be most useful to create for your work?
CCA Study App·Steel Blue