Build
Design systems
One token file, the components that follow it, and templates built from them. Your agent builds every new screen from the same parts.
What's in a system
- Tokens. One file defines every colour, spacing value, radius and font. Every component reads from it.
- Components. The building blocks, from buttons and inputs to data tables and charts, each following the tokens.
- Templates.Complete screens, such as dashboards and sign-in pages, built only from the system's components.
- The AI Brain. Rule files that tell your agent how the system is meant to be used. See AI Brain.
The systems
| System | Licence | Install needs |
|---|---|---|
| Andromeda Pro | AI Canvas Premium License | Free to explore; Premium to install |
| Andromeda Legacy | MIT | Tokens: no account. Components and templates: free account. AI Brain and the Everything install: Premium |
Both come in light and dark.
Install
Every system offers the same four installs. Replace <system> with andromeda-pro or andromeda.
Only the foundation
Tokens, utilities and the system icon. A good start when you build the components yourself.
npx shadcn@latest add @aicanvas/<system>-tokensOne component
The component and the tokens it needs. The name is on the component's page, for example andromeda-pro-accordion.
npx shadcn@latest add @aicanvas/<system>-<component>Every component
npx shadcn@latest add @aicanvas/<system>Every component and the templates
npx shadcn@latest add @aicanvas/<system>-allFiles land in components/aicanvas/<system>/, keeping the system's own folder layout so its imports keep working. A single template installs the same way with its own name, shown on the template's page.
Reshape it
The system is your code once it is installed. Change a token for colour, type or spacing and every component follows. Edit or replace any component, or ask your agent for new ones. With the AI Brain in the project, new parts stay consistent with the rest.
Build with an agent
Give your agent the system, not loose components. With the MCP server connected, ask it to plan the page first: it picks the closest template, one component per part, and installs the tokens before anything else.