「KMRVID Claude Skills」は、こもりまさあきによる動画解説サイト「kmrvid.com」で販売されているオリジナルのClaude Code 向けカスタムスキル集です。
それぞれが実際の業務に取り込んで利用可能なものですが、「スキルの作り方の参考にしたい」など、スキルそのものの作り方を含めた学習・研究用途でのご利用も想定しています。このスキルをご自身の環境に合わせてAIと一緒に改善する、ワークフローを効率化するためのオリジナルスキルへと進化させるといった応用も可能です。是非このスキル群をご活用ください。
※登録されているスキルには、実行の際に必要な依存関係にあるスキルもあります。本ドキュメントの中程の「依存関係」のセクションを参照して、必要なスキルも併せてスキルフォルダにコピーしてください。
詳細は本ドキュメント末尾の更新履歴をご覧ください
各スキルはホームディレクトリ直下の ~/.claude/skills/ に配置することで /スキル名 コマンドとしてマシン内のどこからでも呼び出せます。作業環境のドキュメントルート直下 .claude/skills/ にコピーすればディレクトリ内のみで利用可能です。優先度は ローカル＞グローバル なので、同名スキルが両方にある場合はローカルのものが呼び出されます。
下記のスキルは、Figma MCPを使ったコードの生成やデータ連携、他の各講座内で取りあげる技術スタックを前提としており、基本的には「Vite」で構成されたフロントエンドプロジェクト向けです。スタイリングは、AIとの親和性の高さ、修正のしやすさを考慮し、Tailwind CSS v4 を想定しています。「click-to-fix」など一部のスキルはそれ以外の環境でも動作するようになっていますが、基本的には Vite + Tailwind v4 のプロジェクトでの利用を想定しています。
Claude のモデルは必ずしも上位モデルが下位モデルより優れているとは限りません。モックアップスキルなどでも一般的なサイトであれば「Sonnet」で十分に実装可能です。上位モデルは複雑なUIやデザインの意図を理解するのに有利ですが、必須ではありません。
注意事項
- クロスプラットフォーム（OS）について MacおよびWindowsでの動作を考慮して作成していますが、環境依存のエラーが発生するケースがあります。特にWindows環境では、PowerShell、コマンドプロンプト、WSL（Windows Subsystem for Linux）など実行環境が多岐にわたるため、一部の処理が失敗することがあります。その場合は、AI（Claude）に「このエラーを解決し、現在の環境でスキルが動くように修正して」と直接伝えて対応させてください。
- 環境設定・MCPサーバー名の差異について Claude Code や Claude Desktop のインストール手順、および設定内容によっては、スキルが内部で呼び出す機能（MCPサーバーや外部ツール連携など）の名称が異なる場合があります。極力汎用的な記述を心がけていますが、正常に呼び出せない場合は、AIに設定ファイルの確認やスキルの修正依頼を行ってください。
- Claude Code 自体のアップデートについて Claude Code は開発スピードが非常に早く、頻繁にアップデートが行われます。そのため、バージョンによって挙動が変わる可能性や、解説動画内のUI仕様と異なる場合がありますのでご理解ください。
- 他のAIエージェントへの転用について Claude Code 以外のエージェント（CodexやCursorなど）で本スキルを活用したい場合は、Claude固有の仕様（ツール名やスキル呼び出し構文など）をご自身の環境に合わせて適宜書き換えてご使用ください。
- Node.jsのバージョンについて スキルの実行環境のNode.jsのバージョンもご確認ください。Vite 8の最低動作環境は Ver. 20.xもしくは22.x以上となっております。技術スタックの組み合わせによっては最低22.x以上を要求しますので、スキルが動かない・環境が動作しない場合はNode.jsのバージョンアップをお願いしたします。
Figma デザインを起点にコードを生成したい場合は Figma 系、コードからモックアップを組み上げたい場合は セットアップ系 + モックアップ作成系 を中心に使います。
「kmrvid-skills-figma」にあるスキルセットは、Figma Design Agentにカスタムスキルとして登録することができます（フォルダ内の個々のSKILL.mdを直接登録してください）。