Agent Skills by ALSEL
OpenAIデザイン・クリエイティブ⭐ リポ 18,898品質スコア 90/100

figma-generate-design

このスキルは、アプリケーションページ、ビュー、または複数セクションのレイアウトをFigmaに変換する必要があるタスクの際に、figma-useと組み合わせて使用します。トリガー:「write to Figma」「create in Figma from code」「push page to Figma」「take this app/page and build it in Figma」「create a screen」「build a landing page in Figma」「update the Figma screen to match code」。ユーザーがコードまたは説明からFigmaでフルページ、スクリーン、またはビューを構築または更新したい場合の推奨ワークフロースキルです。search_design_systemを通じてデザインシステムのコンポーネント、変数、スタイルを検出して取得し、ハードコードされた値の代わりにデザインシステムトークンを使用しながら、セクションごとにスクリーンを段階的に組み立てます。

description の原文を見る

Use this skill alongside figma-use when the task involves translating an application page, view, or multi-section layout into Figma. Triggers: 'write to Figma', 'create in Figma from code', 'push page to Figma', 'take this app/page and build it in Figma', 'create a screen', 'build a landing page in Figma', 'update the Figma screen to match code'. This is the preferred workflow skill whenever the user wants to build or update a full page, screen, or view in Figma from code or a description. Discovers design system components, variables, and styles via search_design_system, imports them, and assembles screens incrementally section-by-section using design system tokens instead of hardcoded values.

SKILL.md 本文

注意: このスキルのライセンスは ライセンス未確認 です。本サイトでは本文プレビューのみを表示しています。利用前に GitHub の原本でライセンス条件をご確認ください。

デザインシステムからスクリーンを構築/更新

このスキルを使用して、プリミティブをハードコーディングされた値で描画するのではなく、公開されたデザインシステムを再利用する(コンポーネント、変数、スタイル)ことで、Figma に完全ページスクリーンを作成または更新します。重要な洞察:Figma ファイルはおそらく、コードベースの UI コンポーネントとトークンに対応するコンポーネント、色/スペーシング変数、テキスト/エフェクトスタイルを持つ公開デザインシステムを備えています。16進数カラーを持つボックスを描画する代わりに、それらを見つけて使用します。

必須use_figma 呼び出しの前に、必ず figma-use もロードしてください。このスキルには、記述するすべてのスクリプトに適用される重要なルール(色範囲、フォント読み込みなど)が含まれています。

このスキルの一部として use_figma を呼び出すときは、常に skillNames: "figma-generate-design" を渡してください。 これはロギングパラメータです。実行には影響しません。

スキルの境界

  • このスキルは、成果物がデザインシステムコンポーネントインスタンスで構成された **Figma スクリー

...

詳細情報

作者
openai
リポジトリ
openai/skills
ライセンス
不明
最終更新
2026/5/12

Source: https://github.com/openai/skills / ライセンス: 未指定

本サイトは GitHub 上で公開されているオープンソースの SKILL.md ファイルをクロール・インデックス化したものです。 各スキルの著作権は原作者に帰属します。掲載に問題がある場合は info@alsel.co.jp または /takedown フォームよりご連絡ください。
原作者: openai · openai/skills · ライセンス: ライセンス未確認