Claude MarketplacesSubmit
sickn33 avatar

Web Artifacts Builder

sickn33/antigravity-awesome-skills

This walks you through building React artifacts as single HTML files that work in Claude's artifact viewer. It scaffolds a React 18 + TypeScript + Vite project with Tailwind and 40+ shadcn/ui components already installed, then bundles everything into one standalone HTML file using Parcel. The workflow is pretty opinionated but streamlined: init, develop, bundle, share. Nice touch that it explicitly warns against the centered-purple-gradient aesthetic that screams AI generated. Most useful when you want to quickly prototype interactive UIs in Claude without worrying about deployment or dependencies. The bundling step handles all the path alias resolution and asset inlining automatically, which saves the usual headache of making React apps portable.

skills.sh installs
566
GitHub stars
43.1K
last updated
Jul 14, 2026
View on GitHub

Install

$ npx -y skills add sickn33/antigravity-awesome-skills --skill web-artifacts-builder --agent claude-code

Installs into .claude/skills of the current project.

Files

Web Artifacts Builder

To build powerful frontend claude.ai artifacts, follow these steps:

  1. Initialize the frontend repo using scripts/init-artifact.sh
  2. Develop your artifact by editing the generated code
  3. Bundle all code into a single HTML file using scripts/bundle-artifact.sh
  4. Display artifact to user
  5. (Optional) Test the artifact

Stack: version-selected React/TypeScript/Vite scaffold plus Parcel, Tailwind 3.x and a bundled shadcn-style component snapshot. Mixed snapshot/dependency versions require build verification.

Catalog modification notice: repaired initialization path/version handling, preserved existing outputs, and added explicit checks for the bundled component snapshot. The Apache-2.0 license text is retained. Archive members have no per-file upstream notices/pinned source in this tree; their full provenance/license compatibility is unresolved, so do not claim a complete third-party license audit.

SKILL.md on GitHub

Sponsors

Promote your product hereReach 125k+ visitors monthlyPromote your product hereReach 125k+ visitors monthlyAgent CaffeineSponsoredClose your lid, come back to finished workSnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthlyWaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthlyknobsSponsoredSee your site on any phone, any day, in any language

Details

Repository
github.com/sickn33/antigravity-awesome-skills
First seen
Jun 3, 2026

More from sickn33/antigravity-awesome-skills

All 708

Recommended

1juliusbrussee avatarcavemanjuliusbrussee/cavemanUltra-compressed communication mode. Cuts output tokens 65% (measured) by speaking like caveman while keeping full technical accuracy. Supports intensity levels618.3Kskills.sh installs
2mattpocock avatargrill-memattpocock/skillsA relentless interview to sharpen a plan or design.1.5Mskills.sh installs
3shadcn avatarimproveshadcn/improveSurvey any codebase as a senior advisor and produce prioritized, self-contained implementation plans for OTHER models/agents to execute. Strictly read-only on s40Kskills.sh installs
4obra avatarsystematic-debuggingobra/superpowersUse when encountering any bug, test failure, or unexpected behavior, before proposing fixes326.7Kskills.sh installs
5forrestchang avatarkarpathy-guidelinesforrestchang/andrej-karpathy-skillsBehavioral guidelines to reduce common LLM coding mistakes through explicit assumptions, simplicity, and verifiable success criteria.17.9Kskills.sh installs
6vercel-labs avatarfind-skillsvercel-labs/skillsHelps users discover and install agent skills when they ask questions like "how do I do X", "find a skill for X", "is there a skill that can...", or express int4.3Mskills.sh installs