with one click
token-map
// Map an extracted Figma / source-code token bag onto the active OD design system, producing a deterministic mapping the generate stage can consume.
// Map an extracted Figma / source-code token bag onto the active OD design system, producing a deterministic mapping the generate stage can consume.
| name | token-map |
| description | Map an extracted Figma / source-code token bag onto the active OD design system, producing a deterministic mapping the generate stage can consume. |
| od | {"scenario":"figma-migration","mode":"token-map"} |
Spec ยง10 / ยง21.3.1: every figma-migration / code-migration run crosses the same boundary โ "the source has its own tokens; the target uses the active OD design system; we need a deterministic mapping". This atom produces that mapping.
figma/tokens.json from figma-extract (figma-migration), ORcode/tokens.json from design-extract (code-migration)..od-skills/design-system/DESIGN.md).project-cwd/
โโโ token-map/
โโโ colors.json # { source: '#hex' | 'tokenName', target: '--ds-token' }[]
โโโ typography.json # font + size + weight pairings
โโโ spacing.json # spacing scale crosswalk
โโโ unmatched.json # { source: ..., reason: 'no-target-equivalent' }[]
โโโ meta.json # { sourceKind: 'figma' | 'code', generatedAt, atomDigest }
unmatched.json is the audit list a human reviews; the agent must
not invent target tokens silently.
The atom completes when every input token is either mapped or
explicitly recorded under unmatched.json with a non-empty
reason. The until evaluator reads tokens.unmatched.length === 0
on strict mode; default is "soft converge" (proceed with
unmatched.json populated).
confirmation GenUI surface for that).unmatched.json with reason
target-collision.Reserved id, prompt-only fragment in v1. The deterministic mapping
algorithm + DESIGN.md token-extraction helper land in spec ยง16
Phase 6 alongside figma-extract.
Single-file horizontal-swipe HTML deck. Built by copying the seed `assets/template.html` (which carries the proven 5-rule iframe nav script) and pasting slide layouts from `references/layouts.md`. Pitch decks, product overviews, study material โ when you don't need the magazine aesthetic of `magazine-web-ppt`.
Huashu / huashu-md-html-inspired magazine article layout for turning Markdown or notes into a polished long-form HTML essay.
Twitter quote or data card designed to pair with a post.
Xiaohongshu-style knowledge cards, arranged as a swipeable multi-card carousel.
Turns CSV, Excel, or JSON data into a polished visual report page.
Editorial magazine meets e-ink: 10 layouts and 5 palettes (Ink, Indigo Porcelain, Forest Ink, Kraft Paper, Dune).