Codex Skillsおすすめ｜GitHubのOpenAI Pluginsから導入する方法

Codex Skillsを探すと、旧GitHubカタログと現在のPluginディレクトリが混在して見つかります。

この記事では、現在の公式配布先であるOpenAI Pluginsを基準に、Web開発で使いやすい拡張と安全な導入方法を解説します。

情報確認日：2026年7月11日（日本時間）

結論：現在はopenai/pluginsを入口にし、必要なSkillだけをPlugin経由で追加する

Codex Skillsとは？

CodexのSkillは、繰り返し使う開発手順をSKILL.mdと補助ファイルへまとめたものです。Codexは最初にSkillの名前と説明だけを把握し、作業に合うと判断したときに全文を読み込みます。明示的にSkillを指定することもできます。

現在は、Skill単体をGitHubからコピーするだけでなく、複数SkillsやMCP接続をまとめたPluginとして配布する流れが中心です。個人・リポジトリ内の小さな手順はSkill、チームや他ユーザーへ配るまとまった機能はPlugin、と考えると整理しやすくなります。

SkillとPluginの違い

旧openai/skillsはどうなった？

以前のCodex向け記事では、GitHubのopenai/skillsにある.system、.curated、.experimentalからSkillを選ぶ手順がよく紹介されていました。現在、このリポジトリのREADMEには非推奨であることが明記され、最新のSkill・Plugin例はopenai/pluginsを使うよう案内されています。

古い記事の$skill-installer gh-address-commentsなどが直ちにすべて使えなくなるとは限りませんが、新しく環境を作る場合は公式Pluginsディレクトリと現在のCodexドキュメントを基準にしてください。

OpenAI Plugins GitHubの見方

openai/pluginsでは、各Pluginがplugins/<name>/へ置かれ、.codex-plugin/plugin.jsonで名前、説明、権限、Skillsの場所などを定義しています。READMEで概要を見た後、PluginごとのマニフェストとSkillsを確認します。

• plugin.json：名称、説明、バージョン、機能、Skillsの場所
• skills/：実際にCodexへ読ませる手順
• .mcp.json / .app.json：外部サービスやアプリ連携
• hooks.json：自動実行されるコマンド
• scripts/：ローカルで動くコード
• license：利用・改変・再配布の条件

Web開発者におすすめのCodex Plugins

build-web-apps：Webアプリを設計・実装・確認する

build-web-appsは、フロントエンド資産、ブラウザテスト、UIコンポーネント、決済、データベースなどを扱うOpenAI公式Pluginです。WebサイトやSaaSの試作から、既存アプリの画面追加まで幅広く使えます。

• ブラウザで実装結果を確認する
• shadcn/uiなどのUI部品を組み立てる
• Stripe連携の方式を選ぶ
• Supabase/Postgresのデータフローを検討する
• 生成画像や視覚資産をUIへ組み込む

figma：デザインとコードをつなぐ

figmaPluginは、Figmaのデザインを読み取り、Code to Canvas、Code Connect、デザインシステム規則などを扱う用途向けです。スクリーンショットだけから推測するより、Figmaの構造・コンポーネント・トークンを参照して実装したい場合に適しています。

• Figmaノードから画面構造を読み取る
• 既存コンポーネントとの対応を考える
• デザインシステムのルールをコードへ反映する
• 実装をFigma側へ可視化する
• デザインとコードの差分を確認する

netlify：ビルドとプレビュー公開を整える

netlifyPluginは、Netlifyを使うWebプロジェクトの設定、ビルド、プレビュー、公開フローを扱う場合に向きます。最初から本番公開を任せず、まずデプロイ設定の確認やプレビューURL作成に使います。

notion：要件・調査・会議情報を開発へ接続する

notionPluginは、Notionにある仕様、タスク、会議メモ、調査結果を参照し、実装計画や更新内容へつなぐ用途に向きます。外部Connectorを利用する場合は、参照できるページと書き込み権限を絞ります。

remotion：Reactから動画を生成する

remotionPluginは、Reactベースの動画生成やレンダリング作業を支援します。製品デモ、OG動画、データ可視化動画など、コードで再現可能な動画を作る場合に使えます。

expo：React Nativeアプリを開発する

expoPluginは、Expo・React Native、SDK更新、EAS、モバイルアプリ開発フローに向きます。Web中心のプロジェクトへ無理に入れるのではなく、モバイルコードベースで使います。

Codex Security：承認済みコードをセキュリティ確認する

CodexのPluginディレクトリでは、Codex Securityを使ったコードスキャンも案内されています。一般的なコードレビューとは分け、対象範囲、脅威モデル、根拠、誤検知確認を行うセキュリティ専用フローとして使います。

目的別の選び方

Codex CLIからPluginを導入する

Pluginブラウザを開く

codex
/plugins

PluginブラウザではMarketplaceごとに一覧を切り替え、詳細を開いてインストール・無効化・削除を行えます。導入後は新しいセッションを開始して、追加されたSkillsやツールを使います。

インストール前に詳細を見る

• OpenAI製か、ワークスペース提供か、個人Marketplaceか
• 追加されるSkillsと説明
• MCPやConnectorの接続先
• Hooksやブラウザ拡張の有無
• Read・Writeなどの能力
• 認証が必要な外部サービス

明示的にPluginやSkillを指定する

インストール後、通常の依頼でCodexに選ばせるほか、UIで@やSkill選択を使って対象を明示できます。重要な作業では、「このPluginのこのSkillを使う」と指定し、実行手順を確認します。

デスクトップ・IDEで導入する

ChatGPTデスクトップアプリ

WorkまたはCodexのPlugins画面を開き、OpenAIタブなどからPluginを選択します。外部Connectorが必要なものは、インストール時または初回利用時に認証を求められます。

IDE拡張

IDE拡張のSettingsからPluginsを開き、接続中のCodexホストへ導入します。インストール後に新しいチャットを開始します。

Skill単体を扱う場合

自分のリポジトリだけで使う小さな手順は、.agents/skills/へSkillを置けます。Codexの組み込み$skill-creatorで作成し、必要に応じて$skill-installerで既存Skillを導入します。

$skill-creator
$skill-installer linear

ただし現在の公式配布はPluginが中心です。古いGitHub URLを無条件にインストールするより、現在の公式Marketplaceに同等のPluginがないか先に確認します。

Pluginを安全に評価する

1. 読み取りだけの依頼で始める

コード説明、設定確認、実装計画など、書き込み不要のタスクから試します。外部Connectorも最初は読み取り範囲を狭くします。

2. 実行計画と差分を確認する

依存追加、ファイル作成、外部API、デプロイなどを行う場合は、実行前に計画を出させます。変更後はGit差分とコマンド履歴を確認します。

3. 決定的なテストを別に通す

Pluginの説明や自己評価だけで完成と判断せず、Lint、型チェック、単体テスト、E2E、ビルドを実行します。

4. データ送信先を確認する

ConnectorやMCPを使う場合、入力が外部サービスへ送られます。対象サービスの認証、権限、プライバシー、データ保持を確認します。

5. 不要なPluginを無効化する

使わないPluginはコンテキストと権限管理を増やします。CLIではPluginブラウザから無効化でき、不要になったものはアンインストールします。ConnectorはPlugin削除後も接続が残る場合があるため、接続設定も確認します。

Webアプリ開発のおすすめ構成

Figmaから実装してPreviewへ出す

1. figmaで対象画面とデザインシステムを確認する
2. build-web-appsで既存スタックに合わせて実装する
3. ブラウザとE2Eテストで見た目・操作を確認する
4. netlifyでPreviewへ公開する
5. 人間が差分とPreviewを確認してからマージする

要件をNotionから読み、PRへ反映する

1. notionで対象仕様だけを読み取る
2. Codexに受け入れ条件と未確定事項を整理させる
3. 実装計画をレビューする
4. 必要なPluginだけを使って実装・テストする
5. PR本文へ仕様リンク、変更点、テスト結果を記載する

避けたい使い方

• 旧openai/skillsの記事をそのまま信じ、非推奨の導入経路だけを使う
• 名前が便利そうという理由で複数Pluginを一括導入する
• MCP、Connector、Hooksを確認せず有効化する
• 本番デプロイ権限や管理者権限を最初から渡す
• 外部サービスへ送られるデータを確認しない
• Pluginの自己評価だけでテストや人間レビューを省く

あわせて読みたい記事

• Codex GitHub Actionの使い方
• Claude Code Skillsおすすめ
• GitHub FlowとPull Request
• Reactで外部APIを取得して表示する方法
• Webアプリを作成する流れ

よくある質問

openai/skillsはもう使えませんか？

リポジトリには非推奨表示があります。既存Skillが動く場合はありますが、新規導入は現在の公式ドキュメントとopenai/pluginsを基準にします。

Codex SkillsとPluginsのどちらを使うべきですか？

1つのリポジトリで使う小さな手順はSkill、複数SkillsやMCPをまとめて配布する場合はPluginが向いています。

Codex CLIでPluginを入れるには？

Codexを起動して/pluginsを開き、Marketplaceから詳細を確認してインストールします。導入後は新しいセッションを開始します。

Web開発で最初に入れるなら何がおすすめですか？

既存スタックと目的によります。画面実装ならbuild-web-apps、Figma連携が必要ならfigma、Netlify利用中ならnetlifyを1つずつ試してください。

Pluginを削除すれば外部サービス連携も解除されますか？

PluginのアンインストールとConnectorの認証解除は別の場合があります。Pluginを削除した後、ChatGPTや外部サービス側の接続も確認してください。

まとめ

CodexのSkillsは特定作業を再利用する仕組みですが、現在の公式配布経路はPlugin中心へ移っています。新しく導入する場合は、旧openai/skillsではなく、openai/pluginsとCodexのPlugins画面を入口にしてください。

Web開発ではbuild-web-apps、figma、netlify、notionなどを目的別に1つずつ試します。PluginのSkillsだけでなく、MCP、Hooks、Connector、外部データ送信、権限を確認し、決定的なテストと人間レビューを残すことが重要です。

参考リンク

• Codex Skills公式ドキュメント
• Codex Plugins公式ドキュメント
• OpenAI Plugins GitHub
• 旧OpenAI Skills GitHub
• Agent Skills specification