web-component-design — Skills

What it does

Designing reusable component libraries or design systems

Implementing complex component composition patterns

Choosing and applying CSS-in-JS solutions

Building accessible, responsive UI components

Creating consistent component APIs across a codebase

Refactoring legacy components into modern patterns

Implementing compound components or render props

Modern framework patterns for building reusable, maintainable UI components across React, Vue, and Svelte.

Source

Repository: https://github.com/wshobson/agents

web-component-design FAQ

What does the web-component-design skill do?

Master React, Vue, and Svelte component patterns including CSS-in-JS, composition strategies, and reusable component architecture. Use when building UI component libraries, designing component APIs, or implementing frontend design systems. Designing reusable component libraries or design systems Implementing complex component composition patterns

How do I install web-component-design?

Run: npx -y skills add https://github.com/wshobson/agents --skill web-component-design --agent claude-code — the source lives at github.com/wshobson/agents.

Maintain web-component-design?

Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.

[![web-component-design on getagentictools](https://getagentictools.com/badge/skills/wshobson-agents-web-component-design.svg)](https://getagentictools.com/skills/wshobson-agents-web-component-design?ref=badge)

npx agentictools info skills/wshobson-agents-web-component-design

The second line is the CLI lookup for this page — handy in READMEs and docs.