Analyze a new reference URL mid-project and selectively merge design tokens into the existing design language. Diffs new tokens against current, asks what to adopt/adapt/ignore, updates design-tokens.json and .impeccable.md.
Install
npx skillscat add jthorare/agentic-workflow/design-evolve-web Install via the SkillsCat registry.
Before anything else: read $HOME/.agentic-workflow/toolkit/skills/_preamble.md and follow it (skill index, provider capability map, bootstrap check, session context). Run its Session Close section when this skill finishes.
Design context: read $HOME/.agentic-workflow/toolkit/skills/_design-preamble.md and follow it before continuing.
Design Evolve — Merge New Reference into Design Language
Analyze a new reference site mid-project and selectively merge its design elements into the existing design language. Shows a diff of what would change, lets the user choose what to adopt.
Step 1: Validate Prerequisites
Both .impeccable.md and design-tokens.json must exist. If either is missing:
"No existing design language found. Run
/design-analyzeand/design-languagefirst to establish a baseline before evolving."
Step 2: Validate URL
Validate that the <url> argument starts with http:// or https:// and contains only URL-safe characters: letters, digits, :, /, ., -, _, ~, ?, =, %, +, @, ,.
Reject any URL containing characters outside this allowlist.
If validation fails:
"Invalid URL:
<url>. URLs must start withhttp://orhttps://and may only contain URL-safe characters (a-zA-Z0-9and:/.\\-_~?=%+@,). Offending characters:<list of disallowed characters found>."
Step 3: Run Dembrandt on New URL
Pin the extractor output to a known path so the diff reads an exact file — never a guessed filename. <host> is the URL's hostname (e.g. https://linear.app/features → linear.app). One Bash invocation (shell state does not persist between calls):
SHARED_DIR="$HOME/.agentic-workflow/toolkit/skills/_shared"
source "$SHARED_DIR/repo-slug.sh"
mkdir -p "$AW_DIR/design/raw"
npx dembrandt <url> --dtcg --out "$AW_DIR/design/raw/<host>.json"Verify the pinned file exists and is non-empty; if not, report the dembrandt error and stop. Then Read ~/.agentic-workflow/<repo-slug>/design/raw/<host>.json — this exact file is the merge input.
Step 4: Merge (shared algorithm)
Read $SHARED_DIR/token-merge.md and follow it exactly:
- Step A — category diff table (NEW / DIFFERENT / UNCHANGED) against current
design-tokens.json - Step B — Ask the user Adopt / Adapt / Ignore per group; Adapt requires the follow-up Ask the user capturing the literal replacement value
- Step C — write merged
design-tokens.json; unconditionally append the consultation to.impeccable.md ## Sources; setbaseline_staleinscreens.jsonwhen anything was adopted or adapted - Step D — report counts and exact before→after values
The pinned design/raw/<host>.json is kept — do not delete it.
Next steps
/design-mockup-web— rebuild mockups with the updated tokens (existing baselines are now marked stale)/design-refine— apply the evolved language to existing screens