{"id":93249,"plugin_id":"plugin_asdk_app_6acf97ef6e488191938fbff985dd5d41","kind":"skill","collection_source":"plugin_package","comparison_source":null,"observed_at":"2026-11-12T19:35:08.714Z","digest":"b6fef9672b80c339fddc10ee00c5eb6c2bb734ff7d0c0d9579282bc78a88a645","against":null,"payload":{"description":"Bring a webpage in line with its Figma design using Uiprobe. Use when the user asks to check a page against a Figma frame, fix design differences, do visual QA, or make an implementation \"match the design\", and gives (or has) a Figma URL and a page URL. Needs a code repository, for example in Codex or Claude Code.","included_files":[{"relative_path":"agents/openai.yaml","size_in_bytes":118}],"name":"match-design","skill_md_contents":"---\nname: match-design\ndescription: Bring a webpage in line with its Figma design using Uiprobe. Use when the user asks to check a page against a Figma frame, fix design differences, do visual QA, or make an implementation \"match the design\", and gives (or has) a Figma URL and a page URL. Needs a code repository, for example in Codex or Claude Code.\n---\n\n# Match a page to its Figma design\n\nThe Uiprobe MCP server's instructions explain each tool, how to poll a run, how to expose a local page and how to read a finding's evidence. Follow them. This skill adds the loop around those tools.\n\n## The loop\n\n1. **Find or create the probe.** Call `list_probes` first. If a probe already exists for this design and page, use `rerun_probe` on it so its history is kept. Otherwise call `run_probe`.\n2. **Get the findings.** Wait for the run to finish, then call `get_probe`. Page through with `nextOffset` until you have all of them.\n3. **Triage before editing.** Group the findings:\n   - property findings (text, font, colour, size): fix these first\n   - spacing and layout-shift findings: leave them until after the rerun, since many disappear once the property fixes land\n   - unverified findings: report them, and don't change code for them unless the user asks\n4. **Fix property findings in the source.** Locate each element as the server instructions describe, change the `cssProperty` from `pageValue` to `designValue`, and prefer the project's existing design tokens over raw values when a token matches.\n5. **Rerun.** Call `rerun_probe` on the same probe. For a local page, pass the current tunnel URL.\n6. **Repeat** steps 2 to 5 until only findings you've reported as intentional or out of scope are left. Stop after three rounds without progress and report what remains. Findings the user calls intentional can be set aside with the `uiprobe:triage-findings` skill.\n\n## Reporting\n\nEnd with a short summary for the user:\n\n- what you changed, with each finding's `findingUrl`\n- what's left, and why you didn't change it\n- the probe's viewer URL\n\nDon't change spacing to match the design when it conflicts with the project's layout system (a grid, a spacing scale). Report the conflict instead.\n"},"changes":[],"summary":"First saved snapshot. No earlier version is available for comparison.","summary_kind":"deterministic","summary_metadata":{}}