1,400点以上のSVGロゴ参考ライブラリと監査ツールを備え、Claude、Gemini CLI、CodexなどのAIエージェントをロゴデザインの工程に導くスキル。
fatihaydost/brand-identity-skill
ロゴ、タイポグラフィ、カラーパレットを一つのブランドアイデンティティとして設計し、ガイドライン一式を書き出すClaude Code skill。
- スター
- 335
- フォーク
- 27
- 未解決の Issue
- 0
- 最終コミット
- 3 日前
これは何?
brand-identityは、ひとつのブリーフからブランドアイデンティティ一式を設計するClaude Code skillです。ロゴ、書体、カラーパレットを個別に選ぶのではなく、共通のコンセプトに基づいて制作します。エージェントは3〜4種類のアイデンティティ案を作成し、ユーザーが選べるよう横並びで提示します。
このskillは、結果を提示する前に各案を検証します。WCAG 2.2に基づく色のコントラストチェック、色覚シミュレーション、ブランドが使用する言語のグリフ対応確認、フォントライセンスのチェックを行い、ロゴを16 pxと32 pxでレンダリングします。チェックに失敗した案は修正されるまで提示されず、ヒューリスティックによる指摘は警告として示されます。
案が選ばれると、8ページのPDF、SVGおよびPNG形式のロゴバリエーション、CSS・SCSS・Tailwind・DTCG JSON形式のデザイントークン、埋め込みコード付きのフォントシートを含むブランドガイドライン一式を生成します。既存サイトのロゴ、書体、色を読み取り、各案をそのページ上でプレビューすることもできます。
主な機能
- 01ひとつのブリーフに基づいて、ロゴ、タイポグラフィ、カラーパレットをまとめて制作します。
- 02WCAG 2.2に基づくコントラストをチェックし、色覚をシミュレーションします。
- 03ブランドが使用する言語のグリフ対応とフォントライセンスを確認します。
- 04ロゴファイルと色・書体の仕様を含むブランドガイドラインPDFを書き出します。
- 05CSS、SCSS、Tailwind、DTCG JSON形式のデザイントークンを生成します。
- 06指定されたWebサイトのURLに各アイデンティティ案を適用し、プレビューできます。
ユースケース
- 新しいビジネスや製品のロゴ、フォント、カラーパレットを作成する。
- ロゴはそのままに、既存Webサイトの書体やカラーパレットを刷新する。
- デザイナーがいない小規模チームで、ブランドガイドライン一式を作成する。
- 既存のブランドアイデンティティについて講評を得る。
クイックスタート
- 1
Claude Code にマーケットプレイスを追加する
/plugin marketplace add fatihaydost/brand-identity-skill - 2
brand-identity プラグインをインストールする
/plugin install brand-identity@brand-identity-skill - 3
(リポジトリを clone した状態で)必要なものが揃っているか確認する
python3 skills/brand-identity/scripts/brand.py check - 4
Claude Code に普段の言葉で、ブランドのロゴ、フォント、色を依頼する
使う前に知っておきたいこと
- Python 3.10 以降と、Chrome、Chromium、Edge、Brave などの Chromium ベースのブラウザーが必要です。
- Claude Code でのみ動作します。claude.ai のチャットでは、フォントの測定とレンダリングに失敗します。
- 商標登録簿は検索しないため、ロゴを使用する前に別途、商標クリアランスが必要です。
- フォントの測定とレンダリングには、Google Fonts と PyPI へのネットワーク接続が必要です。
収録されている特集
トピック
よくある質問
- brand-identity-skill とは?
- ロゴ、タイポグラフィ、カラーパレットを一つのブランドアイデンティティとして設計し、ガイドライン一式を書き出すClaude Code skill。 brand-identityは、ひとつのブリーフからブランドアイデンティティ一式を設計するClaude Code skillです。ロゴ、書体、カラーパレットを個別に選ぶのではなく、共通のコンセプトに基づいて制作します。エージェントは3〜4種類のアイデンティティ案を作成し、ユーザーが選べるよう横並びで提示します。
- brand-identity-skill は無料で使えますか?ライセンスは?
- brand-identity-skill は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。
- brand-identity-skill は今もメンテナンスされていますか?
- 活発にメンテナンス中。brand-identity-skill の最終コミットは 2026年11月4日 です。
- brand-identity-skill は何に使えますか?
- 新しいビジネスや製品のロゴ、フォント、カラーパレットを作成する。 ロゴはそのままに、既存Webサイトの書体やカラーパレットを刷新する。 デザイナーがいない小規模チームで、ブランドガイドライン一式を作成する。 既存のブランドアイデンティティについて講評を得る。
- brand-identity-skill のインストール方法は?
- Claude Code にマーケットプレイスを追加する: /plugin marketplace add fatihaydost/brand-identity-skill brand-identity プラグインをインストールする: /plugin install brand-identity@brand-identity-skill (リポジトリを clone した状態で)必要なものが揃っているか確認する: python3 skills/brand-identity/scripts/brand.py check Claude Code に普段の言葉で、ブランドのロゴ、フォント、色を依頼する
- brand-identity-skill はどこで入手できますか?
- ソースコードとインストール手順は GitHub にあります:https://github.com/fatihaydost/brand-identity-skill
概要はプロジェクトの README をもとに AI が生成しています。GitHub の数値は毎日更新されます。
関連プロジェクト
参照UIからビジュアルデザインの特徴を抽出してDesign DNAのJSONにまとめ、それを基に統一感のあるUIを生成するエージェントスキルです。
Geminiの画像モデルでロゴのSVGバリエーションを生成し、紹介画像にレンダリングするClaude Codeスキル。
ClaudeなどのコーディングエージェントをUX/UIデザインの専門家にする、DTCG tokens、コンポーネント仕様、138種類のデザインシステム、52の客観的なゲートを備えた指示・知識キット。
コーディングエージェントにデザインシステム、UI/UXのガイダンス、アイコン、アクセシビリティのレビュー規則を提供するMCPサーバー兼shadcn/uiレジストリ。
Figmaのデザインをコードベースに反映し、コードの状態をFigmaに戻すClaude Codeスキルと、スタイルシステムを統制するスキルです。