figma-design-extraction

Extract design tokens, screen structure, and visual references from Figma files.

Process: CHECK → PARSE → DISCOVER → EXTRACT → ORGANIZE

The goal is to pull structured, source-tracked design data from Figma for use in design-setup pipelines, conflict resolution, and downstream code generation. Every extracted value carries its source tag — this matters because downstream consumers (like design-setup Phase 3) need to know whether a token came from an explicit Figma Variable definition or was inferred from applied styles, since that affects conflict...

Figma ファイルからデザイン トークン、画面構造、ビジュアル参照を抽出します。誰かが Figma のトークン、変数、デザイン システムの抽出、またはスクリーン キャプチャについて言及したとき、会話中に figma.com の URL が登場するたびに使用します。 get_variable_defs、get_design_context、get_metadata、または get_screenshot を呼び出すときにも使用します。このスキルは、それらを効果的に使用する方法を定義します。 「Figma から取得」、「デザインの抽出」、「Figma 変数」、「Figma からのデザイン トークン」、「画面のキャプチャ」、または任意の figma.com/design リンクなどのフレーズをトリガーします。ユーザーが指示なしで Figma リンクを貼り付けるだけの場合でも、このスキルを使用してリンクを解析し、何を抽出するかを決定します。 ソース: petbrains/mvp-builder。