reimagine-it-lock

name	reimagine-it-lock
description	Design DNA capture — extracts palette, type stack, motifs, motion, and 3D signatures from a shipped HTML file and saves them as a reusable reference pack. Use when the user says /reimagine-it lock, "lock this design", "save design DNA", "capture this look", or wants to reuse a shipped design on a different target. Locks capture palette, type, motif, and motion from a shipped HTML file. Part of the reimagine-it Content-Derived Design suite.
license	MIT
metadata	{"author":"Kayforkind","version":"2.11.0","parent":"reimagine-it","hosts":["claude-code","cursor","codex","copilot","gemini-cli"]}
keywords	["lock","design-dna","palette-capture","design-system","reusable-design","style-extraction","content-derived-design"]
category	Design
capabilities	["palette-extraction","type-stack-capture","motif-extraction","motion-signature-capture","design-reuse"]
trigger_phrases	["/reimagine-it lock","lock this design","save design DNA","capture this look","reuse this design","extract palette","lock and reuse"]

/reimagine-it lock

Parent: ../SKILL.md — the full Content-Derived Design engine. This sub-skill handles design DNA capture and reuse.

Captures a shipped design's full identity into a portable markdown pack so it can be reused on any source file:

/reimagine-it lock gold/domains/cinematic/after.html as house-cinema
/reimagine-it lock examples/end-users/horizon/auto.html as ops-console

What gets captured

Category	What	Example
Palette	Ground, accent, support colors with hex values	#08141a ground, #3ae098 accent
Type stack	Display family, body family, fallbacks	Iowan Old Style, Georgia, serif
Motifs	Repeating visual patterns	Pulse wave, heartbeat ring
Motion	Animation budget, keyframe durations	alive-micro, 2–4 loops
3D signature	3D approach for the medium	matcap-hero, card-fan
Section structure	Page anatomy grid	Hero → Cards → Footer

Token translation

Locks include a translation table so a webpage lock can inform another HTML token:

/reimagine-it webpage --ref house-cinema
/reimagine-it infographic --ref house-cinema
/reimagine-it dashboard --ref house-cinema

CLI (machine-readable)

The agent pack is markdown for the LLM. The CLI writes JSON the engine can apply without an agent:

npx reimagine-it lock -i house-style.html -o house.lock.json
npx reimagine-it -i my-page.html --ref house.lock.json -t landing -o on-brand.html
npx reimagine-it -i my-page.html --ref competitor.html --auto -o study.html

--ref accepts a .lock.json file or raw HTML (reverse-lock). Structure stays content-derived; only palette, type, and voice are pinned.

Procedure