Skip to content
Diagnosis · Code

web-artifacts-builder

Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui).

From Anthropicgithub.com/anthropics/skills ↗Source ↗Apache-2.0178,674 repo stars

Examining code for the line that is wrong

Works with
ClaudeChatGPTGeminiClaude CodeCodexCursorCopilotGemini CLI
Setup
One command
Best in a coding tool, where its scripts can run.
Contains
Instructions + 2 scripts
Shell.
Maintained
Last change 3 Oct 2026
On the repository’s main branch.

What it does

Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.

What it can touch

  • Includes 2 scripts

    Your AI can run these when the skill is used — on your computer in a coding tool (which asks first unless you have told it not to), or in the AI’s own sandbox in Claude and ChatGPT.

    How we know

    Found in the skill’s folder: scripts/bundle-artifact.sh, scripts/init-artifact.sh; binary files: scripts/shadcn-components.tar.gz.

  • Mentions an outside service

    The instructions point your AI at these sites or APIs. Anything it sends there leaves your computer.

    How we know

    Web addresses in the SKILL.md, excluding GitHub and documentation sites: ui.shadcn.com.

  • Uses terminal commands

    It shows your AI commands to run. In a coding agent that means your terminal; in a chat app it usually can’t.

    How we know

    The SKILL.md contains shell code blocks.

  • 1 smaller thing worth knowing

    Contains commands that delete or overwrite. Usually legitimate — listed so nothing is hidden.

    How we know

    Contains commands that delete or overwrite — scripts/bundle-artifact.sh line 36. Read 2026-10-04, commit 8a1541c.

    scripts/bundle-artifact.sh, line 36 ↗
  • Partly checked

    Launch7’s check could not read everything in this skill: 1 compiled program file it cannot read. Nothing is known about the parts it skipped.

    How we know

    4 text files read; skipped files are listed by name only. Read 2026-10-04, commit 8a1541c.

  • Recently maintained

    Its repository has had changes recently.

    How we know

    Last push to anthropics/skills: 2026-10-03 (1 days before the scan).

Read automatically from the skill’s own files on GitHub on 4 Oct 2026. Launch7 does not run or manually review skills: this lists what the check saw, and nothing here means “safe”. How we check

Add it to your AI

Partly. Upload it in Claude’s settings — the instructions work; the scripts need the full folder.

  1. Built in your browser from the SKILL.md on GitHub — nothing passes through Launch7.

  2. In Claude, open Customize → Skills, press +, then Create skill → Upload a skill, and choose the .zip.

  3. Make sure code execution is switched on (Settings → Capabilities). Skills need it.

  4. Start a new chat and ask for the job in your own words — Claude picks the skill up when it fits.

This skill ships 2 scripts beside its instructions. The download here is the SKILL.md alone — enough for the instructions, not for the parts that run code. Use the command route, or take the full folder from the repository.

How Claude does this: support.claude.com · checked 28 Sep 2026 · “Supported” means documented by the vendor; Launch7 has not run it end to end

More from anthropics

All from this publisher →
  • algorithmic-art

    Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration.

    From AnthropicIncludes 1 script
  • brand-guidelines

    Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having Anthropic's look-and-feel.

    From AnthropicInstructions only
  • canvas-design

    Create beautiful visual art in .png and .pdf documents using design philosophy.

    From AnthropicInstructions only
  • claude-api

    Reference for the Claude API / Anthropic SDK — model ids, pricing, params, streaming, tool use, MCP, agents, caching, token counting, model migration.

    From AnthropicReview before installing
  • doc-coauthoring

    Guide users through a structured workflow for co-authoring documentation.

    From AnthropicContacts outside web addresses