Start thinking in Milda

Milda is where a team defines its design system as one coherent product: its visual foundations, component APIs, composition rules, behavior, and documentation. From that model, Milda produces the React library and the other surfaces that people actually use.

#The shift

Most design systems are maintained as several loosely connected copies: tokens in one tool, components in a repository, usage guidance in docs, and another interpretation in design files. Milda starts from a different premise: the system is the source; code is one of its outputs.

That changes the authoring question. Instead of asking “what JSX and CSS should this component contain?”, you describe the durable decisions that every output needs to preserve:

• Foundations: the named values and roles that give the system its visual language.
• Contracts: the props, events, defaults, and slots consumers can rely on.
• Structure: the parts of a component and the rules for composing them.
• Behavior: what the component does, including state and accessibility intent.
• Realization: how a particular target turns those decisions into working output.

#One system, three views

These are not separate representations. The Studio, CLI, MCP server, generators, and release pipeline all read the same design-system document.

#What Milda is - and is not

• It is an authoring system and compiler, not a component kit with a fixed look. You define your own system.
• It is the source of truth, not a synchronization layer between several equal sources. Import helps adoption; ongoing changes happen in Milda.
• It produces real source and packages, not a proprietary runtime your product must embed.
• It models portable intent, but does not pretend every platform is identical. Target-specific realization stays explicit.

#How the implementation supports this

Internally, Milda works like a compiler: the Studio edits a canonical, platform-neutral document; generators read it and produce target output. The document is also called the Milda Language or IR. You do not need to hand-author it to use Milda, but understanding its boundaries makes advanced work much easier. Continue with The system model, then explore the Milda Language when you need the formal vocabulary.

#The main building blocks

Want the shortest practical route? Use the Quick start. For the full author-to-consumer loop, follow Build your first design system.