Skip to content
Trending 2026→One of the top-searched agent skills of 2026.

// Generate Claude Artifacts (HTML, SVG, React, Mermaid) the right way — without the common rendering pitfalls.

Artifacts BuilderVerified Creator

git log --oneline --stat
HEAD
Stars
4.1k
Forks
265
Updated
May 27, 2026
repo --stat

  • stars

    4.1k

  • forks

    265

  • last update

    May 27, 2026

  • license

    MITv1.5.0

quickstart.sh
3 steps
  1. Install

    // Drops SKILL.md into ~/.claude/skills/

    $ claude skills add artifacts-builder
  2. Invoke

    // Run from any project directory

    $ claude --skill artifacts-builder "give my landing page a hero treatment"
  3. Iterate

    // Re-run with edits — Claude keeps the skill loaded

    $ claude --skill artifacts-builder "now refactor it"
artifacts-builder/
references
SKILL.md
readonly
name:
Artifacts Builder
slug:
artifacts-builder
version:
v1.5.0
license:
MIT
author:
@anthropic-labs
repository:
github.com/anthropics/skills/tree/main/artifacts-builder
categories:
FrontendToolingDesigner
tags:
#artifacts#html#react#svg#mermaid
description:

Generate Claude Artifacts (HTML, SVG, React, Mermaid) the right way — without the common rendering pitfalls.

features.md
3 capabilities

// What you can do with it

  • Automates the tedious parts of the workflow.
  • Gives Claude the right context, tools, and guardrails.
  • Produces consistent, reviewable output every time.

README.md

artifacts-builder/README.md
5 sections
Loading README…
@anthropic-labs/index.json
more by author

authored by

@anthropic-labs
view profile

$ cat reviews/

Reviews

// No reviews yet. Be the first.
Loading review form…

$ ls related/

explore all →