← Files Themely Design+Style GeneratorARCHIVED FILE
SKILL.md
3.14 KB · Oct 2, 2026 · 00:06 UTC
---
name: legacy-theme-token-migration
description: Convert pasted legacy design tokens, CSS custom properties, Tailwind theme values, or brand-system values into a complete Theme Generator theme. Trigger when the user asks to migrate, import, map, normalize, or modernize an existing token set. Accept source material supplied in conversation, distinguish exact mappings from adaptations and inferred gaps, and never claim direct access to files, Figma, URLs, or external systems.
---
# Legacy Theme Token Migration
## Inputs
Collect:
- the source tokens pasted into the conversation;
- any documented usage or aliases for those tokens;
- the product brief or current Theme Generator theme, when available;
- any values the user requires you to preserve exactly.
Do not infer that a filename, Figma link, package, or website has been read.
Ask the user to paste relevant values when they are not present in the
conversation.
## Workflow
1. Inventory every supplied source token without renaming it yet. Resolve
aliases only when their referenced values are available.
2. Consult the registered `display-theme` contract as the authority for the
required preview and token fields.
3. Map source values by intended use, not merely by similar names:
- map semantic colors according to where foregrounds, backgrounds,
surfaces, actions, accents, and borders are used;
- map typography by role, size, weight, line height, and letter spacing;
- preserve meaningful spacing progression;
- map radii by component intent;
- map shadows by elevation.
4. Classify each mapping as:
- `exact` when the source value and purpose are retained;
- `adapted` when syntax or semantic placement changes;
- `inferred` when a required target value is absent;
- `unmapped` when the source has no target in the closed theme contract.
5. Normalize target values:
- convert color roles to six-digit hexadecimal values;
- use integer font weights from 100 through 900;
- use non-empty CSS-ready strings for other design tokens;
- resolve shorthand colors when unambiguous;
- do not discard alpha by guessing a backdrop.
6. Fill only the gaps required for a cohesive complete theme. Keep inferred
values consistent with the supplied brand system and identify them in the
deliverable.
7. Build demonstration-site content from the supplied brief or current theme.
When material product context is missing and the user wants to provide it,
invoke `specify-parameters` with only facts already known. Do not use that
form to collect token fields it does not support.
8. Invoke `display-theme` with every required preview field and token.
## Deliverable
After displaying the migrated theme, provide a concise mapping ledger with the
source name, target role, classification, and any important adaptation. List
unmapped source tokens and inferred target tokens separately.
## Boundaries
- Do not claim direct file, repository, Figma, URL, or network access.
- Do not add unsupported token categories to `display-theme`.
- Do not claim to operate the widget Share menu. Tell the user that its Text,
CSS, and Tailwind exports are available after the theme is displayed.
SHA-256: 050427aa23f42eb3b6223dde4b0a3f1486d39241941a026fd6f290bd64277d2a