CLAUDE SKILLS
Claudeスキル図鑑
海外で公開されている Claude のスキル・プラグイン213件を、日本語の説明と業務の分類で引けるようにしました。気になるものは詳細ページの「入れ方をコピー」から、Claude Code にそのまま頼めます。
17 件を表示
- おすすめデザイン
unslop
AIで作ったありがちな見た目の画面を、手を入れたデザインに直すスキルです。紫のグラデーションや絵文字の見出しなどを洗い出し、方向性を決めてから余白や配色を順に直します。
こんなとき:AIで作った画面の素人っぽさを直したいとき
スキル★ 9,328更新 2026-11-01 - おすすめデザイン
Refactoring UI Skill
書籍『Refactoring UI』の具体的な決まりごとを Claude に覚えさせるスキルです。余白・文字サイズ・色・影を決まった段階の中から選び、画面の見た目を手順に沿って整えます。
こんなとき:自分で作った画面がどこか素人っぽく見えるとき
スキル★ 688更新 2026-08-26 - おすすめデザイン
Spotkit
機能の説明を伝えると、その機能の画面を単純化した挿絵を SVG のコードとして描くスキルです。12種類の配置の型と共通の決まりで描くので、何枚作っても同じ系統の絵柄にそろい、明暗のテーマにも対応します。
こんなとき:サービス紹介ページに統一感のある挿絵を並べたいとき
スキル★ 104更新 2026-10-08 - デザイン
scroll-craft
スクロールに合わせて映像や文字が動く、作り込んだWebサイトを作るためのスキルです。デザインの基準と制作手順を備え、完成後はブラウザで読みやすさなどを自動で点検します。
こんなとき:スクロールで動く印象的なLPを作りたいとき
スキル★ 4,568更新 2026-09-30 - デザイン
reanimate
気に入ったWebサイトや動画、GIFのアニメーションを録画して分析し、自分のコードで再現するスキルです。再現したものも同じ方法で録画して元と比べ、差がなくなるまで修正を繰り返します。
こんなとき:他サイトの動きを参考に自分のサイトのアニメーションを作りたいとき
スキル★ 1,220更新 2026-10-31 - デザイン
3Dviz Pro Max
一文の指示から、Three.js で動かせる3Dの場面や図解を組み立て、描画結果を画像で確かめながら仕上げるスキルです。村の風景から数学・物理・解剖の立体図まで、作例と手順が入っています。
こんなとき:説明用の立体図や3Dの場面を手早く作りたいとき
スキル★ 1,037更新 2026-09-11 - デザイン
motion-web
動きを中心にした表現力の高いWebサイトを、Three.js・Canvas・WebGL・CSSで作るためのスキルです。バネの揺れなど実際の物理に沿った動きと、動作を自動で確かめる検証スクリプトを備えています。
こんなとき:動きの手触りにこだわったWebページを作りたいとき
スキル★ 840更新 2026-11-05 - デザイン
Guizang Yingzao Skill
自分で撮った建物・街並み・店・器・郷土料理の写真を、構図と文字組みまで考えた雑誌風のポスターに作り替えるスキルです。写真の特徴を残したまま、中国語の見出し文字と被写体を重ねて画像モデルで描き直します。
こんなとき:旅先の写真を雑誌の表紙のように仕上げたいとき
スキル★ 526更新 2026-09-03 - デザイン
GPT Image Skill
ChatGPT の契約を使って、Claude Code や Codex などから画像の生成・編集をするスキルです。手元の参考画像を渡せるほか、複数案を頼むと案ごとに違う指示文を作って並行して生成します。
こんなとき:Claude Code の作業中にそのまま画像も作りたいとき
スキル★ 183更新 2026-08-28 - 公式デザイン
algorithmic-art
p5.jsを使い、乱数の種と調整できるパラメータで、流れ場やパーティクルなどのアルゴリズムアートを作るAnthropic公式のスキルです。既存の作家の作品をまねず、独自の作品を作ります。
こんなとき:コードで描く、オリジナルの抽象画を作りたいとき
スキル - 公式デザイン
brand-guidelines
Anthropicの公式ブランドの色と書体を、資料や画面などの作成物に当てはめるスキルです。ブランドの配色や見た目の決まりに合わせて整えたいときに使います。
こんなとき:作成物の見た目を、Anthropicのブランドに合わせたいとき
スキル - 公式デザイン
canvas-design
デザインの考え方をもとに、ポスターやアート作品などの静止画を、PNGやPDFで新しく作るスキルです。既存の作家の作品は真似しません。
こんなとき:イベント告知用のポスターを、手早く作りたいとき
スキル - 公式デザイン
frontend-design
新しい画面を作るときや既存の画面を作り直すときに、ありきたりにならない意図のあるデザインを助ける公式スキルです。見た目の方向性や文字組みの選び方を扱います。
こんなとき:AIが作る画面が、どれも似た見た目になってしまうとき
スキル - 公式デザイン
slack-gif-creator
Slack向けに最適化した動くGIFを作るための知識と道具をまとめたスキルです。サイズなどの制約、確認用の道具、アニメーションの考え方を備えています。
こんなとき:Slackで使う、オリジナルの動くGIFを作りたいとき
スキル - 公式デザイン
theme-factory
スライド・文書・報告書・HTMLのLPなどに、色と書体のテーマをまとめて当てるスキルです。用意された10種類のテーマから選ぶか、その場で新しいテーマを作れます。
こんなとき:作った資料の色や書体を、まとめてそろえたいとき
スキル - 公式デザイン
design
デザインの講評、デザインシステムの管理、画面の文言づくり、アクセシビリティの点検、調査結果のまとめ、開発者への引き継ぎを手伝うプラグインです。
こんなとき:作った画面の使いやすさを、点検してほしいとき
プラグイン - 公式デザイン
playground
操作パネルとその場のプレビューを備えた、1ファイルの対話型HTML(プレイグラウンド)を作ります。調整した結果をプロンプトとして出力し、コピーボタンで写せます。
こんなとき:色や配置を、画面で触りながら決めたいとき
プラグイン
掲載について
出典:各スキルの GitHub リポジトリ・公式サイト(2026-11-05 時点)
「おすすめ」は、中小企業・個人事業の業務で使いやすいものを編集部が選んだ印です。外部のスキルは、入れる前に中身を確かめてください。