A component library built by AI agent teams

Client: Personal project
Type of project: AI + Code libary
Role: Director
Tool: Claude Code
Year: 2026

Background

A production-grade component library, real tokens, real React components, a working Storybook, is normally an engineering team's job measured in weeks. I wanted to find out whether one designer, writing no code and directing agents instead, could hit the same standard on his own time.

What I did

I directed Claude Code agent teams and wrote none of the code myself. My job was the part that does not automate. I set the standard the work had to meet, decided the build order, and held the quality bar. The agents worked in parallel, each with a named role and its own files, and a QA agent checked every handoff against the standard before it reached me.

The standard was not a vague "make it good." It was concrete and checkable. W3C design tokens in a primitive-and-semantic structure. TypeScript throughout. CSS with no hardcoded values, so every property traces back to a token. WCAG AA on every component. Documentation structured to be read by an AI tool, not just a person. A clear standard is what makes agent work reliable. Without one, the QA has nothing to check against and the output is only ever plausible.

Team-agent-overview
Team-agent-atoms

9 phases, 9 agent teams and 44 agents, worked for 12 to 14 hours. The agent team structure. Solid lines from all five worker agents converge downward to QA Agent. QA Agent reporting issues back to Claude.md.

The result

A real component library, live in Storybook. 56 components across atoms, molecules, organisms, and layout utilities. 260+ W3C design tokens. 65+ interactive stories and 8 foundation pages for color, type, spacing, motion, and the rest. I built it solo, directing 9 agent teams and 44 agents across 9 phases, in 12 to 14 hours of active work.

The proof is not the speed. It is the quality curve. Must-fix issues per phase ran 17, then 4, then 6, then 0. The build got more correct as it went, because each phase stood on a verified foundation and the QA agent caught problems before they compounded. Fast only counts when fast and correct arrive together.

To be exact about what this is: a code library in Storybook, the engineering half of a design system. A full design system also needs a Figma library and a complete documentation setup around it. This case is the code, built to a standard those other layers could sit on.

component-library-content-img

What this changes for a business

This is the part worth sitting with. Built by people, a component library like this is measured in months, a team working through tokens, components, and documentation one piece at a time. With agent teams doing the production, the same system arrives in hours of focused work across a couple of weekends. Collapsing that timeline does more than speed things up. It changes what an organization can attempt. A system stops being a once-in-a-few-years investment you protect and slowly outgrow, and becomes something you can build, rebuild, and keep current as the product changes. What decides the outcome is no longer how long a team can spend or how many people it can spare, but whether someone knows exactly what good looks like and can hold the agents to it.

What it proves

Directing agents to a production standard is a different skill from prompting, and it is the build half of what I do. It depends on knowing precisely what a production library should be, because that knowledge is what the standard, the prompts, and the QA criteria are all made of. The library is the deliverable. The judgment that shaped it is the case.

Contact

Email: pierre@bremell.com
Phone: +
46 709353902
LinkedIn: bremell

© Pierre Bremell
Experience Designer