open-design-design-system-from-url

1<!-- generated:curated-entry -->
2 
3Make an Open Design design system from a website or a Figma file: measure the rendered site (or read the file's variables), write `DESIGN.md` and `tokens.css` from one set of measurements, and check the result against the source before saving it.
4 
5Request: "$ARGUMENTS" — or, if that is empty, the user's request in this conversation (if it isn't clear, ask the user: "Which website, Figma file or Canva design should the design system come from?")
6 
7**How to talk to the user.** Many people using Open Design don't write code, so:
8- Use the user's own words. If they say "artifact", "design tokens" or give a file path, use those terms back; otherwise use the plain words below.
9- Keep the machinery out of replies: no tool names, no ids like `od:prototype:poster-hero`, no internal files (`.artifact.json`, `.comments.json`, `config.json`), and not the words "register", "manifest", "sidecar", "entry" or "surface", unless the user used them first.
10- Explain a print term the first time it comes up, in one short clause, and not again.
11- Say where a file is the way the user would find it ("in your Open Design folder, under seed-swap-flyer"). Give a raw path only where the user can click it (Claude Code, Claude Desktop's Code tab, VS Code) or asks for it.
12- End each reply that finishes a step with one line on what they can do next, with at most two options ("Want it in Instagram sizes too, or is it ready to print?").
13 
14| Instead of | Say |
15|---|---|
16…