/artifacts-builder
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui).
One skill from open-design.
shell
$ npx -y skills add nexu-io/open-design --skill artifacts-builder --agent claude-codeInstalls just this skill. Get the whole plugin for auto-invocation.
How it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfClaude auto-loads it when your prompt matches the work.
- You can call itInvoke it directly when you want it.
- Slash command
/artifacts-builder
Context preview
The summary Claude sees to decide when to auto-load this skill.
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui).
Stats
Stars80,907
Forks9,349
LanguageTypeScript
LicenseApache-2.0
Ships with open-design
SKILL.md
artifacts-builder.SKILL.md
--- name: artifacts-builder description: | Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). triggers: - "artifacts builder" - "html artifact" - "multi component artifact" - "react artifact" od: mode: prototype category: web-artifacts upstream: "https://github.com/ComposioHQ/awesome-claude-skills/tree/master/artifacts-builder" --- # artifacts-builder > Curated from ComposioHQ awesome-claude-skills. ## 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). ## Source - Upstream: https://github.com/ComposioHQ/awesome-claude-skills/tree/master/artifacts-builder - Category: `web-artifacts` ## How to use This catalogue entry advertises the skill in Open Design so the agent discovers it during planning. To run the full upstream workflow with its original assets, scripts, and references, install the upstream bundle into your active agent's skills directory:
