From Migration to Infrastructure

The Sol-to-Tailwind migration produced a webapp for comparing MoMA’s old design language and its Tailwind translation side-by-side. As a byproduct of that work, it established foundational tokens and built out a component library.

That foundational work was followed by a rename from Sol to Archigram, and further modularization—

• archigram-react primitive and block components w/ a Storybook
• archigram-icons the refactoring of the existing icon set, organized by category

Each piece can now be versioned, published, and consumed independently, the way a real design system should be.

I named the result Archigram, after the avant-garde architecture movement that envisioned cybernetic, adaptive environments that heavily parallel modern artificial intelligence. It is a loose reference to Peter Cook’s Plug-In City¹: a permanent architectural frame into which modules could be plugged, swapped, and renewed as needs changed.

Building Docs for Machines

Component libraries are usually documented for humans only—a Storybook app, maybe a style-guide site.

Alongside a human-readable docs site, Archigram also ships archigram-mcp—a Model Context Protocol server² that gives AI agents the same direct, structured access a human designer would have: components, tokens, icons, and guidelines. The server exposes four kinds of tools:

• Component lookup so an agent can find the right primitive and confirm it’s using it correctly, not guessing.
• Icon search over the categorized icon set.
• Design guidelines to expose the same conventions published on the docs site, readable by an agent instead of only a person.
• Page scaffolding to bundle the components, guides, and icons relevant to a task when building out a page.

Question is: can an agent can actually use them to build something?

Not Perfect, But in the Right Direction

Browse MCP demos

Every page in the demos was built with the Archigram MCP making tool calls to gather context on components, icons, and design guidelines before generating anything.

The results were not perfect, as expected. A handful of pages came together right on the first pass. More often, the first draft needed a correction. My guess is that the guidelines weren’t specific enough—missing usage notes? missing patterns for composition? …etc?

Always a Work-in-progress

There’s more tuning ahead… documentation to sharpen, tool discovery to improve, processes to integrate ³. I imagine there will always be some need of human feedback.

Conceptually, dynamic adaptability is what the architecture of Archigram envisioned: a frame meant to stay occupied, plugged into, and renewed indefinitely. This version of the system is just an evolution of its predecessor, extending it from a design language few understood to a provisional and dynamic design system whose decisions are visible to human and machine collaborators alike.

Footnotes

1. Archigram offered “a new vision of the city of the future, a city of components on racks, components in stacks, components plugged into networks and grids, a city of components being swung into place by cranes.” ↩

2. MCP, the Model Context Protocol, is an open standard for exposing tools and data to AI models in a structured way. Analogically, its like an API for APIs. ↩

3. I plan to continue the exploration to sync with Figma, explore styling approaches besides Tailwind CSS and using Web Components to make the components framework agnostic. ↩