Design token migrate

Skill dillonschultz93/quieto-skills/design-token-migrate

Agentic agent skills for the Quieto Tokens design token CLI. Each skill wraps a CLI command into a conversational workflow invocable via slash command.

Install

npx -y skills add dillonschultz93/quieto-skills --skill design-token-migrate

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

One thing to look at

1 stars1 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Scan a codebase for hardcoded CSS values (hex colors, pixel dimensions) that match existing design tokens, and optionally apply exact-match replacements. Use when the user wants to migrate a codebase from hardcoded values to token references.

SKILL.md

2.4 KB, as published. Nobody here has run it

Design Token Migrate

You are helping the user find and replace hardcoded values in their stylesheets with design token references.

Prerequisites

Verify a token system exists:

ls quieto.config.json tokens/

If not found, tell the user to run /design-token-init first.

Workflow

1. Identify the target directory

Ask the user which directory contains the stylesheets to scan. Common targets:

src/styles/
src/components/
src/
app/

The scanner looks at .css, .scss, .sass, .less, and .styl files. It automatically skips node_modules, dist, build, coverage, .next, and .nuxt.

2. Scan for hardcoded values

Run the scan first (read-only, no file modifications):

npx quieto-tokens migrate --scan <target-directory>

For example:

npx quieto-tokens migrate --scan src/styles

To save the report:

npx quieto-tokens migrate --scan src/styles --output migration-report.md

3. Review findings

Present the scan results to the user:

Total files scanned and how many contained matches
Match list: each match shows the file, line number, hardcoded value, suggested token replacement, and confidence level (exact or approximate)
Exact matches are safe to auto-replace; approximate matches need human review

If a report file was generated, read it:

cat migration-report.md

4. Apply replacements (with user consent)

Only proceed to apply if the user explicitly agrees. The apply mode modifies files in-place.

Important: The CLI checks for uncommitted git changes and warns the user. Recommend committing or stashing first:

git status

Then apply:

npx quieto-tokens migrate --apply <target-directory>