atomic-design

Installation
SKILL.md

Build Web Components

Reuse-First Rule

Treat raw DOM or HTML elements, or equivalent low-level primitives, as implementation details of reusable building blocks instead of the default way to assemble feature UI.

Follow this order every time:

  1. Reuse an existing generic component.
  2. Generalize an existing non-generic component and reuse it.
  3. Write new code only after exhausting 1 and 2.
  4. Extract smaller reusable pieces from the new code immediately.

Aim for feature components to be composed mostly of project components, design-system primitives, and framework-native composition mechanisms. Keep direct low-level nodes isolated inside reusable primitives whenever practical.

Recursive Decomposition Rule

Mandatory: every component must be decomposed into smaller components recursively until it can no longer be meaningfully split.

Related skills

More from code-sherpas/agent-skills

Installs
11
First Seen
Mar 18, 2026