# Polyxd

> Polyxd is an open spec, renderers and tools for UI that models generate and teams author: a small JSON document of meaning that renders natively in any design system (Material 3, Carbon, GOV.UK and ten more), checked by a verifier before anyone sees it. There is also a hosted MCP server at https://mcp.polyxd.com/mcp.

Every page below is Markdown. All of them in one file: https://polyxd.com/llms-full.txt

## Start

- [Introduction](https://polyxd.com/docs/index.md): What Polyxd is, the four ideas behind it, what exists today and what is still planned.
- [Quickstart](https://polyxd.com/docs/quickstart.md): Render a UI document with @polyxd/react, validate it with @polyxd/spec, and verify it with polyxd-verify.
- [Your design system](https://polyxd.com/docs/your-design-system.md): Make a Polyxd pack out of your own tokens with one command, and find out in a minute what the contract still needs from you.

## Concepts

- [UI documents](https://polyxd.com/docs/ui-documents.md): The structure of a Polyxd UI document, how it binds to host data, how actions work, and why keys matter.
- [Generated or authored](https://polyxd.com/docs/authored-screens.md): A document doesn't have to come from a generator. Designers author screens in the same format, they render in the same design system, and the verifier holds them to the same rules.
- [Components](https://polyxd.com/docs/components.md): The 44 semantic components, what "semantic" means, how the renderer turns meaning into concrete controls, and the shell components a person authors.
- [Patterns](https://polyxd.com/docs/patterns.md): The six core patterns, what each one is for, and the shared check vocabulary that makes them self-checking.
- [Design systems](https://polyxd.com/docs/design-systems.md): Three token tiers, the semantic contract every pack satisfies, the thirteen packs and twelve original templates, and how to build your own.
- [Dense software](https://polyxd.com/docs/dense-software.md): How Polyxd handles B2B interfaces: data tables, bulk actions, navigation, record pages and density.
- [Design Direction](https://polyxd.com/docs/design-direction.md): The taste layer, in which a company's designers set profile, voice, patterns, rules and exemplars without writing prompts or retraining a model.
- [The designer's job](https://polyxd.com/docs/designers.md): Where taste enters a system that generates its own interfaces — the four touchpoints, what each one is for, and who owns what.
- [Capabilities, journeys and events](https://polyxd.com/docs/product.md): How product teams define what a product can do, which flows must hold, and what gets measured, when screens are generated.
- [People and agents](https://polyxd.com/docs/people-and-agents.md): Why accessibility is the bridge to AI agents, what the renderer guarantees, and how agent tasks are written and run.

## Guides

- [Verifier](https://polyxd.com/docs/verifier.md): What polyxd-verify checks, how to run it, how the v0 score works, and what it has found so far.
- [Runtime](https://polyxd.com/docs/runtime.md): Generate a UI document for an ask with the model you choose, with your Design Direction applied, checked and repaired, streamed, and remembered per intent.
- [Export to A2UI](https://polyxd.com/docs/a2ui.md): Exporting Polyxd UI documents to A2UI v1.0 messages with a custom Polyxd catalog, what is lossy, and why Polyxd keeps its own schema.
- [MCP server](https://polyxd.com/docs/mcp.md): @polyxd/mcp lets the model in Claude, or any MCP host, write Polyxd documents, check them, and show them to the user as a real screen in any design-system pack.
- [VS Code extension](https://polyxd.com/docs/vscode.md): The Polyxd extension for VS Code, Cursor, VSCodium and Windsurf. The check as you type, a live preview in every design system, and the verifier a command away.
- [Generation server](https://polyxd.com/docs/server.md): @polyxd/server puts the runtime behind an HTTP API with streaming, pointed at the model you choose. Run it with Docker or npx.
- [Custom renderers](https://polyxd.com/docs/custom-renderers.md): Replace any component's renderer with the components prop, and how an Astryx adapter is planned to plug in the same way.
- [Rendering a shell](https://polyxd.com/docs/shell.md): How a product renders its shell document with PolyxdFrame, puts screens in the Outlet, routes navigation actions, and supplies its own components through Custom.
- [Renderers](https://polyxd.com/docs/renderers.md): What a conformant Polyxd renderer must do, the two shipped renderers (React and Web Components), the framework-free core they share, the Vue and Svelte adapters, how to run the conformance suite, and native renderers as the next step.
- [Studio](https://polyxd.com/docs/studio.md): Where a design-system team brings its tokens, decides what generated screens may look like, authors screens of its own, delivers them to products, and sees how they do. Hosted at studio.polyxd.com, or run on your own Cloudflare account.

## Reference

- [All components](https://polyxd.com/docs/reference/coverage.md): The complete list: 44 semantic components with what each of 13 design systems calls them, plus the foundations, patterns and renderer behaviours that are not components.
- [Components reference](https://polyxd.com/docs/reference/components.md): All 44 semantic components: props, when to use them, accessibility, rendering rules and platform mappings.
- [Tokens reference](https://polyxd.com/docs/reference/tokens.md): The semantic token contract, with values from Material 3, Carbon and Ant Design.

## Project

- [Roadmap](https://polyxd.com/docs/roadmap.md): The project phases and where each one stands, how Polyxd will be distributed, and what stays free.

## Optional

- [Gallery](https://polyxd.com/gallery/): every example screen in every design system
- [Demos](https://polyxd.com/demos/): four products built with Polyxd
- [GitHub](https://github.com/visualfart/polyxd): the source, Apache-2.0