Flutter Atomic Design widget generator — decompose features into atoms, molecules, organisms, templates, and pages. Audit mode, 14+ design system lenses.
npx claudepluginhub dojocodinglabs/atomic-design-toolkitFlutter Atomic Design widget generator — decompose features into atoms, molecules, organisms, templates, and pages. Audit mode, 14+ design system lenses.
Flutter Atomic Design widget generator — decompose features into atoms, molecules, organisms, templates, and pages. Audit your codebase. Cross-reference against 14+ design systems.
A Claude Code plugin by Luis Andres Pena Castillo.
claude plugin add DojoCodingLabs/atomic-design-toolkit
npx @DojoCodingLabs/atomic-design-toolkit install
Other commands:
npx @DojoCodingLabs/atomic-design-toolkit update # Sync assets to latest version
npx @DojoCodingLabs/atomic-design-toolkit doctor # Health check
npx @DojoCodingLabs/atomic-design-toolkit uninstall # Remove all managed files
| Command | Description |
|---|---|
/atomic-design-toolkit:generate <feature> | Generate a complete widget hierarchy for a feature |
/atomic-design-toolkit:audit [:<system>] | Scan codebase for decomposable widgets + design system gap analysis |
| Skill | Triggers when you... |
|---|---|
design-system-analyzer | Discuss design system gaps, component catalogs, or cross-referencing |
widget-decomposition | Work on a monolithic widget that needs splitting |
/atomic-design-toolkit:generate rescue-alerts
/atomic-design-toolkit:generate adoption-listings
Produces a full Atomic Design decomposition:
/atomic-design-toolkit:audit # Pure codebase scan
/atomic-design-toolkit:audit :material3 # Material 3 gap analysis
/atomic-design-toolkit:audit :cupertino # Apple HIG gap analysis
/atomic-design-toolkit:audit :carbon # IBM Carbon gap analysis
/atomic-design-toolkit:audit :audit:material3 # Combined
14+ supported design systems:
| System | Key Unique Components |
|---|---|
| Material 3 | Badge, BottomSheet, Chip, NavigationRail, SearchBar |
| Cupertino | ActionSheet, ContextMenu, DatePicker, SegmentedControl |
| Fluent 2 | Persona, Toolbar, DataGrid, InfoBar, TeachingBubble |
| Carbon | StructuredList, ContentSwitcher, InlineNotification, TreeView |
| Headless UI | Accessibility-first patterns (ARIA, focus trap) |
| Atlassian | InlineEdit, DynamicTable, Flag notifications |
| Cloudscape | AppLayout, SplitPanel, Wizard |
| Primer | Timeline, StateLabel, Blankslate |
| Polaris | AccountConnection, CalloutCard, IndexTable |
| Spectrum | CoachMark, IllustratedMessage, StatusLight |
| Lightning | ActivityTimeline, DataTable, Path |
| Ant Design | Cascader, Transfer, TreeSelect |
| Chakra UI | Editable, PinInput, Show/Hide |
| Radix UI | HoverCard, NavigationMenu, ScrollArea |
| shadcn/ui | Command, DataTable, InputOTP, Sheet |
| Level | Responsibility | State? | Location |
|---|---|---|---|
| Atom | Single-purpose UI element | No | core/widgets/atoms/ |
| Molecule | Atoms with local interaction | Minimal | core/widgets/molecules/ |
| Organism | Molecules with data binding | Yes | core/widgets/organisms/ |
| Template | Page layout with slots | No | features/*/templates/ |
| Page | Template bound to route | Yes | features/*/pages/ |
atomic-design-toolkit/
├── .claude-plugin/
│ ├── plugin.json
│ └── marketplace.json
├── commands/
│ ├── generate.md # Feature widget generation
│ └── audit.md # Codebase audit + design system gaps
├── skills/
│ ├── design-system-analyzer/
│ │ └── SKILL.md # Auto-activates on DS discussions
│ └── widget-decomposition/
│ └── SKILL.md # Auto-activates on widget refactoring
├── references/
│ ├── atomic-methodology.md
│ └── design-systems/
│ ├── material3.md
│ ├── cupertino.md
│ └── carbon.md
└── README.md
Business Source License 1.1 — you may use, modify, and redistribute for non-competitive purposes. Converts to Non-Profit OSL 3.0 after 5 years.