Shopify

Components — Development skill for Claude Code

Development community

name: ui-extensions-validate-components description: Use when validating component documentation updates in the ui-extensions repo.

How to install Components

Installs to ~/.claude/skills/shopify-ui-extensions-components/SKILL.md

Terminal
mkdir -p ~/.claude/skills/shopify-ui-extensions-components && curl -fsSL https://raw.githubusercontent.com/Shopify/ui-extensions/HEAD/.claude/skills/components.md -o ~/.claude/skills/shopify-ui-extensions-components/SKILL.md

Restart Claude Code, or start a new session, for it to be picked up.

What Components does


name: ui-extensions-validate-components description: Use when validating component documentation updates in the ui-extensions repo. Covers example file format, component descriptions, best practices, limitations, and sections to remove. Run after ui-extensions:style-lint.

Components Validation

Run after `ui-extensions:style-lint`. Also run `ui-extensions:type-definitions` and `ui-extensions:cross-surface`.

**How to use:** Evaluate each item against the files provided. Skip items tha

Alternatives in Development

  • Web Artifacts Builder — Build complex claude.ai HTML artifacts using React, Tailwind CSS, and shadcn/ui 94.1k ★
  • Claude Integration Guide — FOR CLAUDE CODE: When a user asks you to integrate components from this showcase repository into their project 9.3k ★
  • Stitch React Components — Stitch to React components conversion 2.6k ★

Full documentation available on GitHub

View Source Repository