atomic-design

Community

Atomic Design for scalable UI.

AuthoriButters
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Atomic Design methodology for structuring UI components to build scalable design systems.

Core Features & Use Cases

  • Component Hierarchy: Atoms, Molecules, Organisms, Templates, Pages.
  • Organized folder structure reflecting UI grain.
  • Export patterns for component libraries.

Quick Start

Set up src/components with atoms/molecules/organisms/templates/pages and create a simple Button atom plus a Molecule that uses Button.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: atomic-design
Download link: https://github.com/iButters/ClaudeCodePlugins/archive/main.zip#atomic-design

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.