en un clic
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.
Menu
Map an extracted Figma / source-code token bag onto the active OD design system, producing a deterministic mapping the generate stage can consume.
Create animation-rich, zero-dependency HTML presentations on a fixed 1920×1080 stage that scales to any viewport. Distinctive typography, committed palettes, choreographed reveals — no generic AI-slop aesthetics.
Creative Voltage decks: retro-modern electric blue × deep navy split panels, neon yellow badges, halftone dot textures, and script flourishes on a fixed 1920×1080 stage that scales to any viewport. Syne + Space Mono + Yellowtail. Single-file, zero-dependency HTML.
Editorial Forest — a quiet, literary HTML deck theme: deep forest green #2e4a2a, dusty pink #e89cb1, and warm cream #efe7d4 paper set in Source Serif 4 with JetBrains Mono kickers. Mixed light/dark scheme, 8-slide quarterly-review rhythm, fixed 1920×1080 stage scaled to any viewport.
Electric Studio (钴蓝工作室) HTML decks: bold clean vertical split panels — white over cobalt #4361ee — with corner brand marks, a dark accent bar on the panel seam, quote typography as the hero element, all-Manrope 800/400, and confident restrained spacing. Fixed 1920×1080 stage scaled to any viewport, zero dependencies.
Emerald Editorial - magazine-cover business decks: saturated emerald #3CD896 canvas, deep navy #0F1A5C ink, warm paper #F1E9D6 tiles, double-rule masthead ornaments, Bodoni Moda 900 display serif, fixed 1920x1080 stage with uniform viewport scaling. Mixed scheme, 8 slide masters.
Create editorial 'physical notebook' HTML decks: a cream paper card floating on a dark ground, mint/lavender/pink/sky index tabs on the right edge, binder holes on the left, Bodoni Moda display + DM Sans body. Fixed 1920×1080 stage scaled to any viewport. Locked theme — only the content changes.
| 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.
Figma often exports anonymous source names such as color-3,
paint/17, or raw #5B8DEF. Do not ask the user to rename those
before mapping. First infer the semantic role from usage evidence:
Primary,
Selected, Link, Error, Focus, Nav, Button, or CTA.--ds-color-primary than a value that appears once in an illustration.Use that role evidence to choose among existing active design-system
tokens and to decide whether an anonymous token should be renamed or
left unmatched before the executable mapping pass. Keep the on-disk
token-map contract unchanged: the atom still writes the existing bucket
files, unmatched.json, and meta.json only.
For example, this is a useful reasoning note for deciding whether
color-3 should map to the active primary token:
{
"source": "color-3",
"value": "#5B8DEF",
"role": "primary",
"targetCandidates": ["--ds-color-primary", "--ds-color-link"],
"evidence": [
"Button/Primary fill",
"Selected tab indicator",
"Link text in Settings frame"
]
}
Then map to an active design-system token only when the evidence is
role-based, not value-only. If the top candidates are too close to
call, or if the evidence points to conflicting roles (primary vs
link vs focus-ring), leave the source token unmatched using the
existing no-target-equivalent reason and include the competing
candidates in the hint. This keeps automation useful for common
anonymous-token cases while preserving human review for ambiguous
brand decisions.
Without semantic inference, an anonymous Figma token can only produce an uncertain value-level mapping:
{
"source": "color-3",
"value": "#5B8DEF",
"target": null,
"reason": "no-target-equivalent"
}
With semantic inference, the same token should carry role evidence before it is accepted:
{
"source": "color-3",
"value": "#5B8DEF",
"target": "--ds-color-primary",
"via": "name"
}
This prompt-only v1 atom does not claim a measured accuracy lift by
itself. Treat the expected improvement as coverage of previously
manual anonymous-token cases when the Figma tree contains enough role
evidence. Real accuracy numbers require a fixture suite with known
source tokens, expected semantic roles, and a before/after agent run.
See examples/semantic-inference-before-after.json for a deterministic
same-token-batch simulation that compares the old value-level output
with the semantic inference output.
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.