公開日 2026-10-02 · 最終更新：2026年10月4日 · 著者：BazaarLink · Claude Code · Claude Code mods · プラグイン · TypeScript · AIコーディングツール

Claude Code に mods が登場:TypeScript で動作と UI をカスタマイズ

Q: mod はどうインストールしますか?

セッション内で `/plugin install 名前@marketplace`、またはシェルで `claude plugin install 名前@marketplace` を実行します。Claude Code v2.1.287 以降が必要です。

Claude Code に数行の TypeScript で動作や UI を変える mods が追加。公式発表の内容、導入と作成方法、インストール前のセキュリティ確認をまとめました。

2026年10月1日、Anthropic は @ClaudeDevs の投稿で、Claude Code に「mods」を追加できるようになったと発表しました。数行の TypeScript で動作を変え、UI をカスタマイズし、独自機能を差し込めます。Claude に書かせることもできます。mod はプラグインとして配布され、CLI またはデスクトップアプリで /plugin からインストールします。この記事では、公式が公開した内容、導入と作成の方法、インストール前に確認すべきセキュリティ上の注意点をまとめます。

公式のデモ動画

発表の投稿には約71秒のデモ動画が付いています。X で見る。

mod とは

公式ドキュメントによると、mod は Claude Code の見た目と動作を変えるプラグインで、JavaScript または TypeScript のイベントハンドラーで構成されます。ツール呼び出し、プロンプトの送信、画面の一部の描画といったイベントが起きると Claude Code がハンドラーを呼び出し、ハンドラーはイベントを監視、書き換え、または引き継げます。

ドキュメントに載っている主な機能:

モデルに届く前にプロンプトを書き換える
ツール呼び出しをブロック、書き換え、再試行する
権限リクエストを承認または拒否する
ツール出力からシークレットを伏せる
操作できる UI を描く(トランスクリプトの横のペイン、プロンプト上のバンド。タブ、ボタン、入力欄つき)
Claude Code 自身が描く部分(ツール呼び出しの行、スピナー、質問ダイアログなど)を描き直す
Claude のターンを介さずに関数を実行する /command を追加する

複数の mod は積み重ねられ、読み込み順にイベントを処理します。

組み込み機能も mod に

Anthropic のブログによると、組み込みの /diff はすでに mod になっており、/plugin で無効にしたり自作のものに置き換えたりできます。今後さらに多くの組み込み機能が mod に移される予定です。

インストール

mod には Claude Code v2.1.287 以降が必要で、デフォルトで有効、CLI とデスクトップアプリの Code タブで使えます。インストール方法は通常のプラグインと同じです。

# Claude Code のセッション内で
/plugin install token-chart@your-org

# またはシェルで
claude plugin install token-chart@your-org

セッションを開いたままシェルでインストールした場合は、/reload-plugins を実行して読み込みます。token-chart@your-org はドキュメントの例の名前で、実在するパッケージではありません。

作り方

Claude に頼む: Claude Code のセッションで欲しい機能を説明すると、組み込みの plugin-authoring skill を使って Claude が mod を書きます。
自分で書く: 最小の mod は .claude-plugin/plugin.json、hooks/hooks.json、hooks/register.js の3ファイルです。

公式の例は、ツール呼び出しの回数を数えてスピナーの横(Thinking · tool calls: 3…)に表示するもので、フックは2つだけです。

let calls = 0

export function register(on) {
  on('tool.call', async ($, e, next) => {
    calls += 1
    $.ui.invalidate('ui.render')
    return next(e)
  })

  on('ui.render', { component: 'Spinner' }, async ($, e, next) => {
    return next({ ...e, props: { ...e.props, suffix: ' · tool calls: ' + calls + '…' } })
  })
}

セキュリティ: インストール前に必ず確認

公式は明確に警告しています。mod は Claude Code と同じ権限でマシン上で動作し、サンドボックスはありません。読み込まれると次のことができます。

アカウントがアクセスできるすべてのファイルの読み書き、プログラムの起動、ネットワーク通信
環境変数や設定ファイル内の API キーなどのシークレットの読み取り
送信したすべてのプロンプトと Claude のすべてのツール呼び出しの閲覧
プロンプトやツール呼び出しの書き換え、確認される前のツール呼び出しの承認
あなたのプランや API キーでのモデル呼び出し

信頼できる作者とマーケットプレイスからのみインストールしてください。インストール前にプラグインのディレクトリで claude plugin validate を実行すると、hooks: と calls: の行に、処理するイベントと Claude Code に求める操作が表示されます。すべて無効にするには --safe-mode で起動するか、~/.claude/settings.json に "disableAllHooks": true を設定します。

Team / Enterprise プランには、最初に読み込まれ、ユーザーがインストールした mod が権限の deny ルールの上書きなど危険な動作をするのを防ぐ、組み込みの sec-default mod もあります。