# Transtyle > Transtyle is a design system compiler: describe a design system once as W3C (DTCG) design tokens, and compile native, idiomatic theme artifacts for many ecosystems (shadcn/ui, daisyUI, Bootstrap, Apache ECharts, Storybook today). Deterministic builds, explainable derivation, coverage reporting, zero runtime. Designed to be operated by AI agents: config is JSON, diagnostics have stable codes, every build emits report.json. Every docs page is also available as raw markdown by appending `.md` to its URL. The full documentation as one file: https://transtyle.github.io/transtyle/llms-full.txt Live output: 32 running applications at https://transtyle.github.io/transtyle/demo/ — 4 design systems (two invented, plus the real GOV.UK and IBM Carbon systems) each compiled to all 8 targets. Within a target the page is byte-identical across design systems, so the difference between two of them is exactly what the compiler produced. ## Start here - [Overview](https://transtyle.github.io/transtyle/docs/index.md): What Transtyle is, why it exists, and the mental model. - [Getting started](https://transtyle.github.io/transtyle/docs/getting-started.md): From npm install to a compiled theme in four steps. - [You already have a design system](https://transtyle.github.io/transtyle/docs/adopt-existing.md): The main workflow: map an existing design system's vocabulary onto the catalog without renaming anything. ## Learn - [What is a design token?](https://transtyle.github.io/transtyle/docs/what-is-a-design-token.md): The concept from zero, for designers and design-system leads — no code. - [How Transtyle works](https://transtyle.github.io/transtyle/docs/how-transtyle-works.md): The compiler mental model in one diagram — still no code. - [Your first build](https://transtyle.github.io/transtyle/docs/your-first-build.md): A ten-minute walkthrough of the Acme example: build, read the output, ask why. ## Concepts - [Core concepts](https://transtyle.github.io/transtyle/docs/concepts.md): The pipeline, token tiers, semantic catalog, modes, and provenance. - [Derivation engine](https://transtyle.github.io/transtyle/docs/derivation.md): The rules that fill what you did not author, and the promises they keep. - [Design & internals](https://transtyle.github.io/transtyle/docs/internals.md): Where the architecture documents, specifications, and decision records live. ## Guides - [Authoring tokens](https://transtyle.github.io/transtyle/docs/authoring-tokens.md): DTCG token files, aliases, tiers, modes, and the layered layout. - [Example walkthroughs](https://transtyle.github.io/transtyle/docs/examples.md): Acme (minimal input), Cathode (maximal weirdness), and two real, independently-designed systems: GOV.UK and Carbon. - [GOV.UK, end to end](https://transtyle.github.io/transtyle/docs/govuk-showcase.md): A real, independently-designed system compiled to eight ecosystems — the tokens, the judgment calls, and the honest coverage, all shown. - [Write an exporter](https://transtyle.github.io/transtyle/docs/write-an-exporter.md): Build a third-party exporter from zero and prove it with the conformance kit. - [Using Transtyle with AI agents](https://transtyle.github.io/transtyle/docs/ai-agents.md): Transtyle is built to be operated by machines: deterministic builds, stable codes, JSON reports, markdown-native docs. ## Reference - [The Transtyle language](https://transtyle.github.io/transtyle/docs/language.md): The semantic catalog as an interlingua: every slot, how values enter it (aliases or derivation), and how they exit to each target. - [Configuration](https://transtyle.github.io/transtyle/docs/configuration.md): Every field of transtyle.config.json. - [CLI reference](https://transtyle.github.io/transtyle/docs/cli.md): Commands, exit codes, diagnostics format. - [Weird things & diagnostics](https://transtyle.github.io/transtyle/docs/diagnostics.md): Every diagnostic code, and every surprising-but-correct behavior, explained. ## Targets - [shadcn/ui exporter](https://transtyle.github.io/transtyle/docs/exporter-shadcn.md): Era profiles, the mapping table, mode handling, honest limits. - [daisyUI exporter](https://transtyle.github.io/transtyle/docs/exporter-daisyui.md): Complete daisyUI v5 themes (light + dark) from your tokens — where 'secondary' finally means secondary. - [Apache ECharts exporter](https://transtyle.github.io/transtyle/docs/exporter-echarts.md): Data-viz theming from design tokens: per-mode theme objects with a brand-derived categorical palette. - [Bootstrap exporter](https://transtyle.github.io/transtyle/docs/exporter-bootstrap.md): Sass-path and CSS-variable-path Bootstrap themes — the exporter that replaces tint-color() with OKLCH. - [Storybook exporter](https://transtyle.github.io/transtyle/docs/exporter-storybook.md): Theme Storybook's own chrome and compose sibling targets into the preview — the meta-target. - [css-variables exporter](https://transtyle.github.io/transtyle/docs/exporter-css-variables.md): The plugin-API reference implementation and a framework-free escape hatch — every catalog slot as a plain CSS custom property. - [Radix Colors / Themes exporter](https://transtyle.github.io/transtyle/docs/exporter-radix.md): 12-step scales, alpha ramps, and a contrast color per role — the role grid's own acceptance test. - [PrimeNG exporter](https://transtyle.github.io/transtyle/docs/exporter-primeng.md): A definePreset(Aura, overrides) preset — the first target with its own three-tier component-token system, and the first Angular demo in the repo. ## Project - [Status & roadmap](https://transtyle.github.io/transtyle/docs/roadmap.md): What works today, what is specced, and in which order it lands. ## Blog - [A compiler for design systems](https://transtyle.github.io/transtyle/blog/a-compiler-for-design-systems.md) — 2026-08-30: An experiment I finally had time to run: describe a design system once, compile native themes for every ecosystem you ship in. What it is, how it works, and what four real systems look like coming out the other end.