design-token-sync git:20260922.ece18dfA

Immutable. This exact content never changes and is served at /api/v1/blob/74dbee6df3265932.

---
name: design-token-sync
description: One-way push of brand-memory palette and typography to CSS custom properties, Tailwind config, TypeScript declarations, and a Figma variables JSON. Use when generating design tokens, syncing to Figma, or regenerating a Tailwind config.
---

Reads `brand.json` (from brand-memory) and writes to `dist/tokens/` (default `outDir`):

- `tokens.css`: `:root { --color-bg: … }` custom properties
- `tailwind.config.js`: `theme.extend` colors + fontFamily
- `tokens.d.ts`: TS union types + `export const` per color
- `figma-variables.json`: Figma Variables REST API payload

Each starts with `/* Generated by atelier design-token-sync. Do not edit by hand. */`. Never hand-edit; re-run the sync.

## Run

```bash
node plugins/atelier/skills/design-token-sync/index.mjs [projectRoot]   # default cwd
```

```js
import { syncTokens } from './plugins/atelier/skills/design-token-sync/index.mjs';
const written = await syncTokens({ projectRoot: '/path/to/project', outDir: 'dist/tokens' }); // absolute paths
```

Pure emitters, `(cfg) → string`: `emitCss` (`./emitters/css.mjs`), `emitTailwind` (`./emitters/tailwind.mjs`), `emitDts` (`./emitters/dts.mjs`), `emitFigmaVariables` (`./emitters/figma.mjs`).

## Figma

`palette` collection: each color `type: "COLOR"`. `typography` collection: each font `type: "STRING"`. Import via `POST /v1/files/:key/variables` with the payload, or a Figma plugin accepting the variables bulk-import format.

Typography entries with an empty/falsy value are omitted from all outputs.