Figma Implement Design
Translate Figma designs into production-ready UI code with close visual fidelity and component-level detail.
供給アセットの概要
コーディングと開発 Agent
コードレビュー、リポジトリ分析、テスト、CI、GitHub、DevOps、開発ワークフロー向けのスキルです。
シナリオ
コーディング Agent
リポジトリを理解し、コードを編集し、プルリクエストをレビューできるコーディング Agent が必要です。
Agent 適合
Claude Code + OpenAI Agents + Cursor
Codex、Claude Code、Cursor、CLI、またはカスタム Agent に対応します。
インストール
準備完了
npx skills add openai/skills --skill figma-implement-design
メンテナンス
アクティブ
最終プッシュから 1 か月
リスク
試用可
Requires access to the intended Figma design and a human visual QA pass.
GitHub 品質
25K
100/100 品質 · 89/100 信頼
対象タグ
レビュー注記
Requires access to the intended Figma design and a human visual QA pass.
Agent 導入スコアカード
信頼、監査、インストール準備状況を一目で確認
公開リポジトリのメタデータ、OpenAgentSkill のレビューシグナル、保守の鮮度、インストール準備状況を組み合わせたスコアです。候補選定の目安であり、人によるレビューの代替ではありません。
品質
優秀採用度と保守性のシグナルが強い高信頼候補です。
信頼
レビュー後にインストール有望な候補ですが、Agent は実行前に監査メモ、インストールポリシー、成果エビデンスを確認する必要があります。
監査
試用可インストール準備、安全メタデータ、保守、採用リスクの機械可読なレビュー。
OpenAgentSkill Trust Score v5
Agent インストール候補
人による確認またはサンドボックス検証後に第一候補として使用します。
スター
GitHub スター 25K
リポジトリ活動
スター 25K、フォーク 1.7K
メンテナンス
最終プッシュから 1 か月
ライセンス
Source terms (see source)
インストール
npx skills add openai/skills --skill figma-implement-design
インストール安全性
標準パッケージまたはランタイムのインストールパス
権限範囲
公開メタデータに高リスクな権限範囲はありません
Agent の成果
Agent の成果データはまだありません
ドキュメント
README/SKILL.md の文脈が十分です
リスク概要
低いメタデータリスク
- Requires access to the intended Figma design and a human visual QA pass.
インストール準備状況
インストールパスを利用可能
- インストールパスを利用できます
- リポジトリの根拠を利用できます
- ライセンスが明示されています
- Agent-Proven の成果エビデンスはまだありません
Agent 可読メタデータ
このスキルの機械可読な判断データ。
このブロックまたは埋め込み JSON を使い、Agent がこのスキルをインストールすべきか、代替を選ぶべきか、先に人のレビューを求めるべきかを判断できます。
適したタスク
- デザインとクリエイティブ ワークフロー
- Claude Code チーム
- GitHub 採用シグナルを重視するチーム
- Inspect visual requirements
適した Agent
インストール判断
- コマンド
- npx skills add openai/skills --skill figma-implement-design
- ポリシー
- レビュー
- 人によるレビュー
- はい
信頼とリスク
- 信頼
- 86/100
- 監査
- 91/100
- リスクレベル
- 試用可
成果ループ
- エンドポイント
- /api/agent/outcome
- イベント ID
- resolve
- 成果
- 5
インストールコマンド
npx skills add openai/skills --skill figma-implement-design使わない場合
- ベンダー提供の SLA が必要なチーム
- production agents without a repository review
- Requires access to the intended Figma design and a human visual QA pass.
- Production credentials, payments, or irreversible account changes without explicit human review
- Sensitive private data before reviewing repository code, license, and permission surface
代替スキル
Frontend Design
170.9K スター
npx skills add anthropics/skills --skill frontend-design
代替スキル
Taste Skill: Anti-Slop Frontend
79.0K スター
npx skills add Leonxlnx/taste-skill --skill design-taste-frontend
代替スキル
Canvas Design
170.9K スター
npx skills add anthropics/skills --skill canvas-design
代替スキル
Anthropic Brand Guidelines
170.9K スター
npx skills add anthropics/skills --skill brand-guidelines
Agent セーフティ v2
79/100 · インストール前にレビュー
公開メタデータに高リスクな権限ヒントはなく、監査と安全性のシグナルは良好です。
監査ページを確認してから、サンドボックスのワークフローで Agent のインストールを許可してください。
中
ネットワークアクセス
Skill はリモートページ、API、リポジトリ、外部サービスにアクセスする可能性があります。
- Requires access to the intended Figma design and a human visual QA pass.
インストール先
Agent ワークフローにこのスキルをインストール
公開インストールエンドポイントからコマンド、安全チェックリスト、対象プロンプト、正規リンクを取得します。
OpenAgentSkill CLI
Resolve policy, run the source installer safely, and report a verified install receipt.
$ npx --yes https://github.com/Leon-Drq/openagentskill/releases/download/cli-v0.2.1/openagentskill-0.2.1.tgz install figma-implement-designAgent 解決プラン
インストール前に Agent に適合性を検証させます。
Resolve API は第一候補、代替、安全ポリシー、監査メモ、インストール先、Agent がそのまま使えるプロンプトを返します。
JSON を開く
/api/agent/resolve?task=Use%20Figma%20Implement%20Design%20for%20an%20agent%20workflow&agent=codex&max_risk=medium
Resolve テキスト
/api/agent/resolve?task=Use%20Figma%20Implement%20Design%20for%20an%20agent%20workflow&agent=codex&max_risk=medium&format=text
インストール引き継ぎ
/api/skills/figma-implement-design/install
Agent が確認すべきこと
- Resolve API でタスク適合と代替を確認。
- 監査・信頼スコアと安全ポリシーの警告を確認。
- Codex、Claude Code、Cursor、CLI のインストール先互換性を確認。
プロンプトをコピー
Task: Use Figma Implement Design in this workspace.
Resolve first: https://www.openagentskill.com/api/agent/resolve?task=Use%20Figma%20Implement%20Design%20for%20an%20agent%20workflow&agent=codex&max_risk=medium
Review install handoff: https://www.openagentskill.com/api/skills/figma-implement-design/install
Install command: npx skills add openai/skills --skill figma-implement-design
Before running it, summarize audit warnings, required permissions, and the fallback skill if install is risky.Agent 引き継ぎ
別のディレクトリではなく、インストール経路を Agent に渡します。
公開インストールエンドポイントからコマンド、安全チェックリスト、対象プロンプト、正規リンクを取得します。
インストール引き継ぎ
/api/skills/figma-implement-design/install
LLM テキスト形式
/api/skills/figma-implement-design/install?format=text
代替を探す
/api/skills/search?q=Figma%20Implement%20Design&limit=3
Agent プロンプト
Use Figma Implement Design for this task. Review https://www.openagentskill.com/api/skills/figma-implement-design/install, then install with: npx skills add openai/skills --skill figma-implement-designRegistry メタデータ
自動スキル選択用の Agent 可読プロファイル。
Registry API 経由で判断、信頼、監査、ユースケース、インストールのシグナルを提供し、UI をスクレイピングせずに Agent が順位付けできます。
Manifest
/api/registry/manifest/figma-implement-design
LLM テキスト
/api/registry/manifest/figma-implement-design?format=text
インストール別名
/api/registry/install/figma-implement-design
推奨
/api/registry/recommend?task=Use%20Figma%20Implement%20Design%20in%20an%20agent%20workflow&limit=3
Agent 適合
デザインとクリエイティブ
プラットフォーム
Codex, Claude Code, Cursor, OpenAI Agents
Agent 判断パネル
デザインとクリエイティブ 向けの第一候補
有力候補として扱い、自分の Agent スタックで README とインストール経路を検証してください。
スタック内の役割
第一候補
主な適合
デザインとクリエイティブ
信頼ラベル
本番対応
インストールパス
コマンド準備済み
使う場面
- デザインとクリエイティブ ワークフロー
- Claude Code チーム
- GitHub 採用シグナルを重視するチーム
根拠
- GitHub スター 25,103
- 最近のリポジトリ活動
- インストールコマンドまたは GitHub リポジトリが利用可能
- 品質プロファイル 100/100
- OpenAgentSkill エンゲージメント 135 件
先にレビュー
- Requires access to the intended Figma design and a human visual QA pass.
実装パス
- 1サンドボックスの Agent にインストールし、デザインとクリエイティブ タスクを一度最初から最後まで実行します。
- 2Compare output quality, latency, and failure behavior against at least one alternative.
- 3Promote it into production only after reviewing repository permissions, license, and maintenance signals.
信頼プロファイル
レビュー後にインストール
有望な候補ですが、Agent は実行前に監査メモ、インストールポリシー、成果エビデンスを確認する必要があります。
GitHub 採用度
合格GitHub スター 25K
スター／フォーク活動
合格スター 25K、フォーク 1.7K; 現在のメタデータでは Issue 活動を利用できません
最近のメンテナンス
合格最終プッシュから 1 か月
ライセンスの明確さ
合格Source terms (see source)
良いシグナル
- 手動確認済みの掲載
- AI レビュー承認済み
- インストールパスを利用できます
- リポジトリの根拠を利用できます
- 最近保守されたリポジトリ
- Large GitHub adoption signal
- インストールコマンドに明確な高リスクパターンはありません
- OpenAgentSkill の利用活動を検出しました
- 成果ループは準備済みですが、最初の実行が必要です
インストール前にレビュー
- Requires access to the intended Figma design and a human visual QA pass.
- 実際の Agent 成果レポートはまだありません
- 無人インストールの前に人によるレビューが必要です
推奨アクション
人による確認またはサンドボックス検証後に第一候補として使用します。
品質プロファイル
優秀 Agent ワークフロー向けの候補
採用度と保守性のシグナルが強い高信頼候補です。
ワークフロー適合
このスキルを使うシナリオ
Create assets
Design and creative
I need my agent to produce design assets, UI directions, presentations, or creative media workflows.
Build and ship code
Coding agents
I need a coding agent that can understand a repository, edit code, and review pull requests.
Manage repositories
GitHub automation
I need my agent to triage GitHub issues, review pull requests, and summarize repository changes.
ワークフロー適合
完全なワークフローに追加
Design, build, test, and ship interfaces
Frontend and UI
A practical workflow for agents that turn product briefs or Figma designs into polished frontend code, review the result, test it in a browser, and prepare a safe deployment.
Inspect, patch, and verify code
Coding review agent
A workflow for software agents that inspect repositories, review pull requests, generate tests, and turn findings into shippable patches.
Operate and verify web apps
Browser QA agent
A workflow for agents that navigate products, fill forms, take screenshots, and verify real user flows across web applications.
代替候補
インストール前に比較
このタスクに適する可能性のある類似スキル。
Frontend Design
Guidance for distinctive, intentional UI design, typography, visual direction, and non-template-like product interfaces.
Taste Skill: Anti-Slop Frontend
Design and implementation guidance for distinctive landing pages, portfolios, product demos, and purposeful redesigns.
Canvas Design
Create original visual art, posters, PNG assets, and PDF documents through a clear design philosophy.
Anthropic Brand Guidelines
Apply Anthropic official brand colors, typography, and visual standards to appropriate Anthropic-related artifacts.
概要
A source-verified OpenAI skill for converting Figma specifications and links into production-ready application code. Use it when implementing components or screens against explicit Figma designs. Confirm access to the supplied design and review visual QA before treating a generated implementation as final.
プラットフォーム互換性
技術詳細
- バージョン
- 1.0.0
- ライセンス
- Source terms (see source)
- 最終更新
- 2026年8月22日
- 公開日
- 2026年7月21日
フレームワークとツール
判断の要約
第一候補
GitHub スター 25,103
Agent 実証エビデンス
Agent 実証エビデンス
Resolve、レビュー、インストール、限定実行後の成果レポート。
- 成功率
- —
- 直近の失敗
- —
- 成果
- 0
- 出力品質
- —
- 失敗
- 0
- 非該当
- 0
- インストール数
- 0
- リスクによりブロック
- 0
- 設定が必要
- 0
- 本番
- 0
Agent の実行結果はまだありません。最初の実行では /api/agent/outcome を通じて成功、設定要件、リスクによるブロック、失敗、非該当を報告できます。
成長ループ
共有キット
Figma Implement Design 用のシナリオベース草案です。X へ手動投稿できます。
Figma Implement Design: Translate Figma designs into production-ready UI code with close visual fidelity and componen... 25.1K stars https://www.openagentskill.com/skills/figma-implement-design?ref=x
任意：インストールコマンド付きの返信
Listing + install path for Figma Implement Design: https://www.openagentskill.com/skills/figma-implement-design?ref=x Install: npx skills add openai/skills --skill figma-implement-design
掲載元
Registry により登録
この掲載は公開ソースから登録されており、メンテナー申請が承認されるまで公式として表示されません。
- 作成者
- openai
- インデックス作成者
- OpenAgentSkill コミュニティインデックス
帰属は公開リポジトリまたは作成者プロフィールにリンクされています。作成者は掲載を申請して所有権シグナルを更新できます。
このスキルを申請所有者の申請
このスキル掲載を申請
この Registry により登録 掲載は openai に帰属していますが、まだ公式として表示されていません。申請すると、確認済み所有者シグナルが追加され、今後の公開、インストール、監査更新の信頼性が高まります。
クリエイター被リンクキット
README にエビデンスバッジを追加
開発者がリポジトリを評価する場所で、正規掲載、現在の信頼・監査シグナル、実際の Agent-Proven エビデンスを表示します。
[](https://www.openagentskill.com/skills/figma-implement-design)
[](https://www.openagentskill.com/skills/figma-implement-design)
[](https://www.openagentskill.com/skills/figma-implement-design/audit)
[](https://www.openagentskill.com/skills/figma-implement-design)作者
openai✓
@openai
プラットフォーム適合
健全性シグナル
- GitHub スター
- 25.1K
- 品質スコア
- 71/100
- 最終 GitHub プッシュ
- 2026年7月14日
- フレームワークのヒント
- 3
- OpenAgentSkill 閲覧数
- 44
- インストールコピー数
- 2
- 外部クリック
- 2
コミュニティシグナル
このスキルが Agent ワークフローに役立つかを共有してください。集約されたフィードバックがランキングを改善します。
信頼と安全性
レビュー後にインストール
- GitHub 採用度GitHub スター 25K合格
- スター／フォーク活動スター 25K、フォーク 1.7K; 現在のメタデータでは Issue 活動を利用できません合格
- 最近のメンテナンス最終プッシュから 1 か月合格
- ライセンスの明確さSource terms (see source)合格
- README/SKILL.md の完全性メタデータには十分な利用・ワークフロー文脈があります合格
- 依存関係／ランタイムのリスク公開メタデータに重大な依存関係リスクのヒントはありません合格
関連スキル
Frontend Design
Guidance for distinctive, intentional UI design, typography, visual direction, and non-template-like product interfaces.
170.9K スターTaste Skill: Anti-Slop Frontend
Design and implementation guidance for distinctive landing pages, portfolios, product demos, and purposeful redesigns.
79.0K スターCanvas Design
Create original visual art, posters, PNG assets, and PDF documents through a clear design philosophy.
170.9K スターAnthropic Brand Guidelines
Apply Anthropic official brand colors, typography, and visual standards to appropriate Anthropic-related artifacts.
170.9K スター