Claude Code 向けオリジナルスキル集
制作の一連の工程を、
"スキル"で自動化する
Claude Code で動く46個のオリジナルスキルを収録した単体パッケージです。セットアップからモックアップ作成、Figma連携、Tailwindの整理、仕上げの品質チェックまで、Web制作のワークフローを一通りカバー。使い方だけでなく、スキルの作り方まで解説する動画付き（40本・約4時間10分／2026年9月20日現在）。
発売記念価格 19,800円 → 15,400円（税込）
2026年9月23日（水）23:59まで
46個
収録スキル数（一般非公開のものを含む）
40本
解説動画の本数
4h10m
総再生時間（2026年9月20日時点）
Claude版の特長
プロンプトを都度書く代わりに、うまくいった手順を「スキル」として保存し、何度でも呼び出せる形にします。
Claude Codeで動く実務スキル
セットアップ、モックアップ作成、Figma連携、Tailwind最適化、仕上げまで、Web制作の工程ごとにスキルを用意。主にClaude Code環境と、Vite + Tailwind CSS v4構成のフロントエンドプロジェクトを想定しています。
46スキル × 動画40本のボリューム
一般非公開のスキルを含む全46個を日本語化し、そのスキル解説を動画にして約4時間10分に凝縮。スキルは不定期で機能改善・強化のため更新予定。
使い方だけでなく"作り方"まで
「使い方」だけでなく「そのスキルの中身」まで解説。自分の業務に合わせて改善・開発する教材にもなります。
Figma Design Agent 内で動く専用カスタムスキルは、本パッケージには含まれません。Figma内で使いたい場合は「KMRVID Figma Skills」、両方使いたい場合は「All-in-One Bundle」をご検討ください。
収録46スキル
Web制作の工程ごとに、6つのカテゴリに整理しています。各スキルの説明はスキル一覧ページで確認できます。
6スキル
セットアップ系
新規プロジェクトを立ち上げる
- setup-astro
- setup-html
- setup-react
- mockup-pipeline
- full-pipeline
- lp-pipeline
7スキル
モックアップ作成系
コードからUIを組み上げる
- brief-me
- create-mockup
- create-multi-mockup
- mobile-polish
- create-design-md
- export-design-md
- rewrite-me
18スキル
Figma系
Figmaと連携する（Tailwindベース）
- figma-audit
- figma-component-audit
- figma-weather
- figma-layer-rename
- figma-tidy-up
- figma-tokenize
- figma-componentize
- figma-enhance
- figma-optimize
- figma-contrast-check
- figma-to-tailwind
- tailwind-to-figma
- figma-workflow
- figma-pipeline
- figma-update-checker
- figma-update-patch
- code-to-figma
- figma-node-check
3スキル
Tailwind系
スタイリングを整える
- css-to-tailwind
- tailwind-review
- tailwind-typescale
10スキル
仕上げ・改善系
実装時、実装後の品質を上げる
- astro-i18n
- html-to-astro
- astro-doctor
- japanese-web-guideline
- cognitive-ui-design
- japanese-lp-seasoning
- click-to-fix
- visual-polish
- finish-me
- a11y-review
2スキル
パイプライン設計支援系
自分のパイプラインを設計したいときに
- pipeline-thinking
- pipeline-composer
発売記念価格料金
KMRVID
Claude Skills
単体パッケージとして、46個のClaude Code向けスキルを、15,40019,800円（税込）の買い切りでご利用いただけます。発売記念として、2026年9月23日（水）23:59まで特別価格でご案内しています。
2026年9月23日（水）23:59まで
- Claude Code向けスキル46個（非公開のものを含む）
- 解説動画40本・約4時間10分
- 使い方だけでなく、作り方の解説付き
- 買い切り・視聴期限なし
公式LINE友だち登録で、さらに10%OFFクーポンも配布中
LINEで10%OFFクーポンを受け取る本パッケージに付属するオリジナルスキルは、利用環境やツールのバージョンによって正常に動作しない場合があります。個別のスキル修正・動作サポート対応は行っておりません。
Figmaでも使いたい方へ
Figma版とのセットもあります
Figma Design Agent のカスタムスキル登録機能で動く、Figma専用スキルの単体パッケージと、Claude版とのセット「All-in-One Bundle」をご用意しています。
Figma Design Agent
KMRVID Figma Skills
Figma Design Agentのカスタムスキル登録機能で動く、Figma専用スキル群。キャンバス上で選択して呼び出すだけで使えます。
- スキル
- 30個
- 解説動画
- 20本
- 総時間
- 約1時間55分
15,400円税込・買い切り
Claude Code + Figma Design Agent
KMRVID Skills - All-in-One Bundle
Claude版とFigma版の全スキルを収録したセット。両方使う場合は、個別に購入するよりお得です。
- スキル
- 76個
- 解説動画
- 60本
- 総時間
- 約6時間5分
29,800円税込・買い切り
All-in-One Bundleは、Claude版とFigma版を通常価格で個別に購入するより5,400円お得です。
FAQ
よくある質問
スキルはどんな環境で使えますか？▾
主にClaude Code環境と、Vite + Tailwind CSS v4構成のフロントエンドプロジェクトを想定しています。利用環境やツールのバージョンによっては、正常に動作しない場合があります。個別のスキル修正・動作サポート対応は行っておりませんので、あらかじめご了承ください。
Figma版・All-in-One Bundleとの違いは何ですか？▾
本パッケージは、Claude Code向けのスキルのみを収録した単体パッケージです。Figma Design Agent内で動くFigma専用スキルは含まれません。Figma専用スキルのみのKMRVID Figma Skillsと、両方を収録したAll-in-One Bundleもあわせてご検討ください。
購入前にスキルの動作を試すことはできますか？▾
軽量版スキル「create-mockup-lite」をGitHubにて無料公開しています。購入前にお使いの環境で動作をご確認いただけます。使い方はこちらの記事でも動画付きで紹介しています。
プログラミング未経験でも受講できますか？▾
Figmaやコーディングを日常的に行うWeb制作者・フリーランスを主な対象としています。スキルの「作り方」も解説するため、AI活用ワークフローを学びたい方にも役立つ内容です。
収録スキルの詳細はどこで確認できますか？▾
全スキルの詳細・依存関係を紹介するスキル紹介ページを別途ご用意しています。詳しくはこちらからご確認ください。
15,40019,800円で
今日から始める
46個のClaude Code向けスキルを、15,40019,800円（税込）の買い切りでお申し込みいただけます。発売記念価格は2026年9月23日（水）23:59までです。
15,40019,800円で申し込むFigma版とのセット「All-in-One Bundle」はこちら