Claude Skills: カスタムな Claude Code Skill を作成する方法 (2026)

Claude Skills: カスタム Claude Code Skills の作成方法 (2026年版)

Claude Code は、Anthropic によるソフトウェア開発用の AI 搭載 CLI です。最も強力でありながら十分に活用されていない機能の1つが「カスタムスキル」です。これは、繰り返しのタスクを自動化し、チームの規約を遵守させ、標準化されたワークフローを構築するために作成できる、再利用可能なスラッシュコマンドです。

このガイドでは、Claude Code スキルの作成、構成、および共有について、知っておくべきことすべてを解説します。

Claude Code Skills とは？

スキル（Skills）とは、一般的なタスクに対する特定の指示を Claude Code に提供する、カスタムのスラッシュコマンドです。Claude Code で /your-skill-name と入力すると、あらかじめ定義されたプロンプトが読み込まれます。これには、Claude の動作をガイドするコンテキスト、制約、および例が含まれています。

スキルは、いわば「強化された保存済みプロンプト」です。以下のようなことが可能です。

特定の出力フォーマットを定義する。
プロジェクト固有のコンテキストを含める。
コーディング標準や規約を強制する。
複数のステップからなるワークフローを自動化する。
バージョン管理を通じてチーム間で共有する。

スキルの仕組み

スキルは、特定のディレクトリに Markdown ファイルとして保存されます。呼び出されると、Claude Code はそのファイルを読み込み、その内容を指示として使用します。

項目	詳細
ファイル形式	Markdown (`.md`)
保存場所	プロジェクト内の `.claude/skills/` またはグローバルの `~/.claude/skills/`
呼び出し方法	Claude Code 内で `/skill-name` を入力
スコープ	プロジェクトレベル、またはユーザーレベル
共有方法	チーム共有のためにバージョン管理にコミットする

最初のスキルを設定する

ステップ 1: スキルディレクトリを作成する

mkdir -p .claude/skills

すべてのプロジェクトで使用できるグローバルスキルの場合：

mkdir -p ~/.claude/skills

ステップ 2: スキルファイルを作成する

.claude/skills/commit.md を作成します。

# Commit

現在ステージングされている変更に対して git commit メッセージを生成します。

## Rules

1. `git diff --cached` を使用して、ステージングされたすべての変更を分析する
2. Conventional Commits フォーマットに従ってコミットメッセージを記述する
3. 1行目: type(scope): description (最大72文字)
4. Types: feat, fix, refactor, docs, test, chore, perf, ci
5. 変更が些細でない場合は、本文（body）を含める
6. コードの変更内で言及されている場合は、関連する issue 番号を参照する
7. コミットメッセージに絵文字を含めない
8. コミットをステージングするが、実行前にユーザーに確認を求める

## Format

type(scope): short description

Longer description of what changed and why. This is optional for simple changes.

Refs: #issue-number (if applicable)


## Examples

Good:
- `feat(auth): add JWT refresh token rotation`
- `fix(api): handle null response in user endpoint`
- `refactor(db): migrate from raw SQL to Prisma ORM`

Bad:
- `updated stuff` (曖昧すぎる)
- `fix bug` (スコープがなく、説明も不十分)
- `FEAT: Add new feature!!!` (フォーマットが誤っており、絵文字のような過剰な勢いがある)

ステップ 3: スキルを使用する

Claude Code で次のように入力します。

/commit

Claude Code はスキルファイルを読み込み、指示に従って適切にフォーマットされたコミットメッセージを生成します。

実用的なスキルの例

コードレビュー・スキル

.claude/skills/review.md を作成します。

# Code Review

指定されたファイルまたは最近の変更に対して、徹底的なコードレビューを実行します。

## Process

1. ファイルが指定されていない場合は、`git diff` を使用して未コミットのすべての変更をレビューする
2. 以下のカテゴリについてコードを分析する：

### セキュリティ
- SQL インジェクション、XSS、CSRF の脆弱性
- ハードコードされたシークレットや認証情報
- 不適切な入力バリデーション
- 認証/認可の問題

### パフォーマンス
- N+1 クエリ
- インデックスの欠落（データベース関連の場合）
- 不要な再レンダリング（React の場合）
- メモリリーク
- 非効率なアルゴリズム

### コード品質
- 命名規則
- 関数の長さ（50行を超える関数にフラグを立てる）
- ロジックの重複
- エラーハンドリングの欠落
- TypeScript 型の欠落（TS プロジェクトの場合）

### テスト
- 新しい関数はテストでカバーされているか？
- エッジケースが考慮されているか？
- モックは適切か？

## Output Format

見つかった各問題について、以下を提供すること：
- **Severity**: Critical / Warning / Suggestion
- **Location**: ファイル名と行番号
- **Issue**: 何が問題か
- **Fix**: 解決するための具体的なコード

最後に要約を記述：深刻度別の合計問題数と全体的な評価。

API エンドポイント・スキル

.claude/skills/api-endpoint.md を作成します。

# API Endpoint

プロジェクトの規約に従って新しい API エンドポイントを作成します。

## Stack

このプロジェクトでは以下を使用しています：
- Next.js App Router (Route Handlers)
- TypeScript (strict mode)
- Zod (バリデーション用)
- Prisma (データベースアクセス用)
- NextAuth (認証用)

## Requirements

1. `src/app/api/[endpoint]/route.ts` にルートハンドラーを作成する
2. Zod スキーマによる入力バリデーションを含める
3. `getServerSession` を使用した認証チェックを追加する
4. 適切な HTTP ステータスコードでエラーを処理する
5. 型定義された JSON レスポンスを返す
6. エンドポイントの JSDoc コメントを追加する

## Template

```typescript
import { NextRequest, NextResponse } from "next/server";
import { getServerSession } from "next-auth";
import { z } from "zod";
import { authOptions } from "@/lib/auth";
import { prisma } from "@/lib/prisma";

const requestSchema = z.object({
  // スキーマをここに定義
});

/**
 * このエンドポイントの機能説明
 * @method POST/GET/PUT/DELETE
 * @auth Required
 */
export async function POST(request: NextRequest) {
  try {
    const session = await getServerSession(authOptions);
    if (!session?.user) {
      return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
    }

    const body = await request.json();
    const validated = requestSchema.parse(body);

    // 実装をここに記述

    return NextResponse.json({ data: result });
  } catch (error) {
    if (error instanceof z.ZodError) {
      return NextResponse.json({ error: error.errors }, { status: 400 });
    }
    console.error("[API_ENDPOINT]", error);
    return NextResponse.json({ error: "Internal server error" }, { status: 500 });
  }
}

エンドポイントの作成を求められた場合は、このテンプレートに厳密に従い、特定のユースケースに適応させてください。


### コンポーネント・スキル

`.claude/skills/component.md` を作成します。

```markdown
# Component

プロジェクトの規約に従って新しい React コンポーネントを作成します。

## Stack

- React 19 (Server Components をデフォルトとする)
- TypeScript (strict mode)
- Tailwind CSS v4 (スタイリング用)
- Shadcn/ui (ベースコンポーネント用)
- 必要な場合のみ "use client" ディレクティブを使用する（イベントハンドラー、フック、ブラウザ API など）

## Rules

1. 適切なディレクトリにコンポーネントを作成する：
   - 共通 UI: `src/components/ui/`
   - 機能固有: `src/components/[feature]/`
   - ページレベル: ページと同一ディレクトリに配置
2. props には interface を使用する（type ではなく）
3. 名前付きエクスポート（named export）を使用する（default ではなく）
4. すべての props に適切な TypeScript 型を含める
5. 条件付きクラスには `cn()` ユーティリティを使用する
6. アクセシビリティを確保する（ARIA 属性、キーボードナビゲーション）
7. コンポーネントは150行以内に収める。それ以上の場合は分割する。

## Naming

- ファイル名: `kebab-case.tsx`
- コンポーネント名: `PascalCase`
- Props インターフェース: `ComponentNameProps`

## Template

```tsx
import { cn } from "@/lib/utils";

interface ComponentNameProps {
  className?: string;
  children?: React.ReactNode;
}

export function ComponentName({ className, children }: ComponentNameProps) {
  return (
    <div className={cn("base-styles", className)}>
      {children}
    </div>
  );
}


### データベースマイグレーション・スキル

`.claude/skills/migration.md` を作成します。

```markdown
# Migration

Prisma データベースマイグレーションを作成します。

## Process

1. マイグレーションで何を行うかを確認する（テーブル追加、カラム変更、インデックス追加など）
2. `prisma/schema.prisma` の Prisma スキーマを更新する
3. `npx prisma migrate dev --name descriptive-name` を実行する
4. マイグレーションで新しいモデルが作成される場合は、以下も作成する：
   - `src/lib/validations/` に Zod バリデーションスキーマ
   - `src/lib/db/` に基本的な CRUD 関数
5. マイグレーションが成功したことを確認する

## Naming Convention

マイグレーション名は説明的な kebab-case にすること：
- `add-users-table`
- `add-email-index-to-users`
- `rename-post-title-to-headline`
- `add-subscription-status-enum`

## Rules

- 既存のマイグレーションファイルを決して修正しない
- 既存のテーブルに新しい必須カラムを追加する場合は、必ずデフォルト値を追加する
- WHERE 句で使用されるカラムにはインデックスを追加する
- snake_case のデータベース名には `@map` および `@@map` を使用する

プロジェクトレベル vs. グローバルスキル

スコープ	場所	ユースケース
プロジェクト	`.claude/skills/`	チームの規約、プロジェクト固有のワークフロー
グローバル	`~/.claude/skills/`	個人の好み、プロジェクト橫断的なツール

プロジェクトレベルのスキルは、同名のグローバルスキルを上書きします。これにより、開発者が個人の好みを維持しつつ、チームが規約を強制することができます。

チームでのスキルの共有

スキルはリポジトリ内の単なる Markdown ファイルであるため、共有はバージョン管理にコミットするだけで完了します。

git add .claude/skills/
git commit -m "feat: add team coding skills for Claude Code"
git push

Claude Code を使用しているチームメンバーは、リポジトリをプルすると自動的にこれらのスキルを利用できるようになります。

効果的なスキルを書くためのヒント

出力フォーマットを具体的に指定する。 曖昧な指示は一貫性のない結果を招きます。正確なコードテンプレートを示してください。
例を含める。 良い例と悪い例を示すことで、Claude は期待事項をより良く理解できます。
技術スタックを明記する。 特定のフレームワーク、言語、ツールに言及するスキルは、より優れた結果を生み出します。
スキルの焦点を絞る。 1つのタスクに1つのスキルを割り当てます。「レビュー」スキルと「コミット」スキルを分けるべきであり、「レビュー兼コミット」スキルにすべきではありません。
スキルファイルを繰り返し改善する。 最初はシンプルに始め、Claude の出力品質に基づいて改良していきます。
制約を使用する。 「default export を使用しないでください」という指示は、「名前付きエクスポートを推奨します」よりも効果的です。

スキルのデバッグ

スキルが期待通りに動作しない場合：

ファイルの場所を確認する。 .claude/skills/ または ~/.claude/skills/ にある必要があります。
ファイル拡張子を確認する。 .md である必要があります。
Claude Code を再起動する。 スキルは Claude Code の起動時に読み込まれます。
プロンプトを直接テストする。 スキルの内容をコピーして通常のメッセージとして貼り付け、問題がどこにあるかを切り分けます。

まとめ

カスタム Claude Code スキルは、Claude を汎用的なアシスタントから、チームの規約、フレームワーク、ワークフローを熟知した「チームの一員」としての開発パートナーへと変貌させます。セットアップには数分しかかかりませんが、その生産性の向上は使うたびに積み重なっていきます。

もし、あなたの開発ワークフローに AI 生成メディアが含まれているなら、Hypereal AI を無料でお試しください（35クレジット、クレジットカード不要）。その API は、開発中の画像生成、動画作成、アバター制作などのタスクのために、Claude Code から直接呼び出すことができます。

Claude Skills: カスタム Claude Code Skills の作成方法 (2026年版)

このガイドでは、Claude Code スキルの作成、構成、および共有について、知っておくべきことすべてを解説します。

Claude Code Skills とは？

スキルは、いわば「強化された保存済みプロンプト」です。以下のようなことが可能です。

特定の出力フォーマットを定義する。
プロジェクト固有のコンテキストを含める。
コーディング標準や規約を強制する。
複数のステップからなるワークフローを自動化する。
バージョン管理を通じてチーム間で共有する。

スキルの仕組み

項目	詳細
ファイル形式	Markdown (`.md`)
保存場所	プロジェクト内の `.claude/skills/` またはグローバルの `~/.claude/skills/`
呼び出し方法	Claude Code 内で `/skill-name` を入力
スコープ	プロジェクトレベル、またはユーザーレベル
共有方法	チーム共有のためにバージョン管理にコミットする

最初のスキルを設定する

ステップ 1: スキルディレクトリを作成する

mkdir -p .claude/skills

すべてのプロジェクトで使用できるグローバルスキルの場合：

mkdir -p ~/.claude/skills

ステップ 2: スキルファイルを作成する

.claude/skills/commit.md を作成します。

# Commit

現在ステージングされている変更に対して git commit メッセージを生成します。

## Rules

1. `git diff --cached` を使用して、ステージングされたすべての変更を分析する
2. Conventional Commits フォーマットに従ってコミットメッセージを記述する
3. 1行目: type(scope): description (最大72文字)
4. Types: feat, fix, refactor, docs, test, chore, perf, ci
5. 変更が些細でない場合は、本文（body）を含める
6. コードの変更内で言及されている場合は、関連する issue 番号を参照する
7. コミットメッセージに絵文字を含めない
8. コミットをステージングするが、実行前にユーザーに確認を求める

## Format

type(scope): short description

Longer description of what changed and why. This is optional for simple changes.

Refs: #issue-number (if applicable)


## Examples

Good:
- `feat(auth): add JWT refresh token rotation`
- `fix(api): handle null response in user endpoint`
- `refactor(db): migrate from raw SQL to Prisma ORM`

Bad:
- `updated stuff` (曖昧すぎる)
- `fix bug` (スコープがなく、説明も不十分)
- `FEAT: Add new feature!!!` (フォーマットが誤っており、絵文字のような過剰な勢いがある)

ステップ 3: スキルを使用する

Claude Code で次のように入力します。

/commit

Claude Code はスキルファイルを読み込み、指示に従って適切にフォーマットされたコミットメッセージを生成します。

実用的なスキルの例

コードレビュー・スキル

.claude/skills/review.md を作成します。

# Code Review

指定されたファイルまたは最近の変更に対して、徹底的なコードレビューを実行します。

## Process

1. ファイルが指定されていない場合は、`git diff` を使用して未コミットのすべての変更をレビューする
2. 以下のカテゴリについてコードを分析する：

### セキュリティ
- SQL インジェクション、XSS、CSRF の脆弱性
- ハードコードされたシークレットや認証情報
- 不適切な入力バリデーション
- 認証/認可の問題

### パフォーマンス
- N+1 クエリ
- インデックスの欠落（データベース関連の場合）
- 不要な再レンダリング（React の場合）
- メモリリーク
- 非効率なアルゴリズム

### コード品質
- 命名規則
- 関数の長さ（50行を超える関数にフラグを立てる）
- ロジックの重複
- エラーハンドリングの欠落
- TypeScript 型の欠落（TS プロジェクトの場合）

### テスト
- 新しい関数はテストでカバーされているか？
- エッジケースが考慮されているか？
- モックは適切か？

## Output Format

見つかった各問題について、以下を提供すること：
- **Severity**: Critical / Warning / Suggestion
- **Location**: ファイル名と行番号
- **Issue**: 何が問題か
- **Fix**: 解決するための具体的なコード

最後に要約を記述：深刻度別の合計問題数と全体的な評価。

API エンドポイント・スキル

.claude/skills/api-endpoint.md を作成します。

# API Endpoint

プロジェクトの規約に従って新しい API エンドポイントを作成します。

## Stack

このプロジェクトでは以下を使用しています：
- Next.js App Router (Route Handlers)
- TypeScript (strict mode)
- Zod (バリデーション用)
- Prisma (データベースアクセス用)
- NextAuth (認証用)

## Requirements

1. `src/app/api/[endpoint]/route.ts` にルートハンドラーを作成する
2. Zod スキーマによる入力バリデーションを含める
3. `getServerSession` を使用した認証チェックを追加する
4. 適切な HTTP ステータスコードでエラーを処理する
5. 型定義された JSON レスポンスを返す
6. エンドポイントの JSDoc コメントを追加する

## Template

```typescript
import { NextRequest, NextResponse } from "next/server";
import { getServerSession } from "next-auth";
import { z } from "zod";
import { authOptions } from "@/lib/auth";
import { prisma } from "@/lib/prisma";

const requestSchema = z.object({
  // スキーマをここに定義
});

/**
 * このエンドポイントの機能説明
 * @method POST/GET/PUT/DELETE
 * @auth Required
 */
export async function POST(request: NextRequest) {
  try {
    const session = await getServerSession(authOptions);
    if (!session?.user) {
      return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
    }

    const body = await request.json();
    const validated = requestSchema.parse(body);

    // 実装をここに記述

    return NextResponse.json({ data: result });
  } catch (error) {
    if (error instanceof z.ZodError) {
      return NextResponse.json({ error: error.errors }, { status: 400 });
    }
    console.error("[API_ENDPOINT]", error);
    return NextResponse.json({ error: "Internal server error" }, { status: 500 });
  }
}

エンドポイントの作成を求められた場合は、このテンプレートに厳密に従い、特定のユースケースに適応させてください。


### コンポーネント・スキル

`.claude/skills/component.md` を作成します。

```markdown
# Component

プロジェクトの規約に従って新しい React コンポーネントを作成します。

## Stack

- React 19 (Server Components をデフォルトとする)
- TypeScript (strict mode)
- Tailwind CSS v4 (スタイリング用)
- Shadcn/ui (ベースコンポーネント用)
- 必要な場合のみ "use client" ディレクティブを使用する（イベントハンドラー、フック、ブラウザ API など）

## Rules

1. 適切なディレクトリにコンポーネントを作成する：
   - 共通 UI: `src/components/ui/`
   - 機能固有: `src/components/[feature]/`
   - ページレベル: ページと同一ディレクトリに配置
2. props には interface を使用する（type ではなく）
3. 名前付きエクスポート（named export）を使用する（default ではなく）
4. すべての props に適切な TypeScript 型を含める
5. 条件付きクラスには `cn()` ユーティリティを使用する
6. アクセシビリティを確保する（ARIA 属性、キーボードナビゲーション）
7. コンポーネントは150行以内に収める。それ以上の場合は分割する。

## Naming

- ファイル名: `kebab-case.tsx`
- コンポーネント名: `PascalCase`
- Props インターフェース: `ComponentNameProps`

## Template

```tsx
import { cn } from "@/lib/utils";

interface ComponentNameProps {
  className?: string;
  children?: React.ReactNode;
}

export function ComponentName({ className, children }: ComponentNameProps) {
  return (
    <div className={cn("base-styles", className)}>
      {children}
    </div>
  );
}


### データベースマイグレーション・スキル

`.claude/skills/migration.md` を作成します。

```markdown
# Migration

Prisma データベースマイグレーションを作成します。

## Process

1. マイグレーションで何を行うかを確認する（テーブル追加、カラム変更、インデックス追加など）
2. `prisma/schema.prisma` の Prisma スキーマを更新する
3. `npx prisma migrate dev --name descriptive-name` を実行する
4. マイグレーションで新しいモデルが作成される場合は、以下も作成する：
   - `src/lib/validations/` に Zod バリデーションスキーマ
   - `src/lib/db/` に基本的な CRUD 関数
5. マイグレーションが成功したことを確認する

## Naming Convention

マイグレーション名は説明的な kebab-case にすること：
- `add-users-table`
- `add-email-index-to-users`
- `rename-post-title-to-headline`
- `add-subscription-status-enum`

## Rules

- 既存のマイグレーションファイルを決して修正しない
- 既存のテーブルに新しい必須カラムを追加する場合は、必ずデフォルト値を追加する
- WHERE 句で使用されるカラムにはインデックスを追加する
- snake_case のデータベース名には `@map` および `@@map` を使用する

プロジェクトレベル vs. グローバルスキル

スコープ	場所	ユースケース
プロジェクト	`.claude/skills/`	チームの規約、プロジェクト固有のワークフロー
グローバル	`~/.claude/skills/`	個人の好み、プロジェクト橫断的なツール

チームでのスキルの共有

スキルはリポジトリ内の単なる Markdown ファイルであるため、共有はバージョン管理にコミットするだけで完了します。

git add .claude/skills/
git commit -m "feat: add team coding skills for Claude Code"
git push

Claude Code を使用しているチームメンバーは、リポジトリをプルすると自動的にこれらのスキルを利用できるようになります。

効果的なスキルを書くためのヒント

出力フォーマットを具体的に指定する。 曖昧な指示は一貫性のない結果を招きます。正確なコードテンプレートを示してください。
例を含める。 良い例と悪い例を示すことで、Claude は期待事項をより良く理解できます。
技術スタックを明記する。 特定のフレームワーク、言語、ツールに言及するスキルは、より優れた結果を生み出します。
スキルの焦点を絞る。 1つのタスクに1つのスキルを割り当てます。「レビュー」スキルと「コミット」スキルを分けるべきであり、「レビュー兼コミット」スキルにすべきではありません。
スキルファイルを繰り返し改善する。 最初はシンプルに始め、Claude の出力品質に基づいて改良していきます。
制約を使用する。 「default export を使用しないでください」という指示は、「名前付きエクスポートを推奨します」よりも効果的です。

スキルのデバッグ

スキルが期待通りに動作しない場合：

ファイルの場所を確認する。 .claude/skills/ または ~/.claude/skills/ にある必要があります。
ファイル拡張子を確認する。 .md である必要があります。
Claude Code を再起動する。 スキルは Claude Code の起動時に読み込まれます。
プロンプトを直接テストする。 スキルの内容をコピーして通常のメッセージとして貼り付け、問題がどこにあるかを切り分けます。

Hyperealで構築を始めよう

Claude Skills: カスタム Claude Code Skills の作成方法 (2026年版)

Claude Code Skills とは？

スキルの仕組み

最初のスキルを設定する

ステップ 1: スキルディレクトリを作成する

ステップ 2: スキルファイルを作成する

ステップ 3: スキルを使用する

実用的なスキルの例

コードレビュー・スキル

API エンドポイント・スキル

プロジェクトレベル vs. グローバルスキル

チームでのスキルの共有

効果的なスキルを書くためのヒント

スキルのデバッグ

まとめ

関連記事

Claude Code 入門ガイド & ベストプラクティス (2026)

完璧な CLAUDE.md ファイルの書き方 (2026年版)

OpenRouterでClaude Codeを使用する方法 (2026年版)

今日から構築を開始

Hyperealで構築を始めよう

Claude Skills: カスタム Claude Code Skills の作成方法 (2026年版)

Claude Code Skills とは？

スキルの仕組み

最初のスキルを設定する

ステップ 1: スキルディレクトリを作成する

ステップ 2: スキルファイルを作成する

ステップ 3: スキルを使用する

実用的なスキルの例

コードレビュー・スキル

API エンドポイント・スキル

プロジェクトレベル vs. グローバルスキル

チームでのスキルの共有

効果的なスキルを書くためのヒント

スキルのデバッグ

まとめ

関連記事

Claude Code 入門ガイド & ベストプラクティス (2026)

完璧な CLAUDE.md ファイルの書き方 (2026年版)

OpenRouterでClaude Codeを使用する方法 (2026年版)

今日から構築を開始