✅canva-brand-check
- プラグイン
- canva
- ソース
- GitHub で見る ↗
説明
Canvaのデザインをブランドキットと照合し、逸脱箇所を報告します。対象となるのは、パレット外の色、非ブランドフォント、ロゴの誤使用、トーンが外れたコピーです。 読み取り専用のため、変更は一切加えません。 次のような場合に使用: ユーザーが「これはブランドに合っていますか」「ブランドキットと照合してください」「ブランドレビューをしてください」「ブランドガイドラインと一致していますか」「デザインのブランドチェックをしてください」と尋ねたとき。
原文を表示
Check a Canva design against a brand kit and report where it diverges — off-palette colors, non-brand fonts, logo misuse, and off-tone copy. Read-only; makes no changes. Use when the user asks "is this on brand", "check this against our brand kit", "do a brand review", "does this match our brand guidelines", or "brand-check my design".
ユースケース
- ✓デザインがブランドキットに合致しているか確認したいとき
- ✓パレット外の色が使われていないか検査するとき
- ✓ロゴの誤使用を報告してもらいたいとき
- ✓ブランドガイドラインの遵守状況を監査するとき
本文(日本語訳)
ブランドチェッカー
デザインをユーザーのブランドキットと照合し、ブランドに沿っている箇所とズレている箇所を項目ごとに報告します。
これは canva-design-feedback の特化版(ブランド対応版)です。「デザインを読み込み、批評する」という読み取り専用のコアは同じですが、評価基準がブランドキットになります。
デザインを編集することは一切ありません。
ブランドキットのデータギャップ — 最初に必ずお読みください
Canva:list-brand-kits は、ブランドキットの ID・名前・サムネイル を返すことがドキュメントに明記されています。ただし、機械可読なカラーパレット(hex値)やフォントファミリーは返さない場合があります。
実際に取得できた内容に応じて、以下のように対応してください:
- キットにカラー/フォントが含まれている場合 → そのhexコードとフォント名をそのまま評価基準として使用します(精密チェック)。
- サムネイル/名前のみが取得できた場合 → hex/フォントの正確な照合はできません。キットのサムネイルとのビジュアル比較にフォールバックし、精密チェックのためにブランドカラー(hex)とフォントをユーザーに貼り付けてもらうよう依頼してください。その情報なしでは、カラー/フォントの判定は近似値にとどまる旨を明示してください。
ブランドカラーやフォントを絶対に捏造しないでください。実際の値が手元にない場合は、その旨を明確に伝えてください。
デザインの実際のカラーとフォントの読み取り方
Canva:get-design-content はテキストのみを返し、カラーやフォントは返しません。
- 読み取り専用の編集トランザクション(
Canva:start-editing-transaction→ 検査 →Canva:cancel-editing-transaction、必ずキャンセルする)を使うと、要素のテキスト・位置・サイズを確実に取得できます。 - カラーとフォントはトランザクションから確実には取得できません — テスト済み:多くの場合、テキスト・位置・サイズのみが返され、カラー/フォント属性は含まれません。そのため、サムネイルがカラーとタイポグラフィの主要な根拠となります。ペイロードにスタイルデータが含まれていた場合はそれを活用しますが、実際にペイロードに含まれていない限り、デザインのhex値やフォントを事実として断言しないでください。
ブランドキット(前述のギャップ参照)とデザイン本体の両方で機械可読なカラー/フォントが取得できないことが多いため、ブランドチェックは多くの場合、ビジュアル比較(デザインのサムネイル vs. ブランドキットのサムネイル)とユーザーが提供するパレット/フォントの組み合わせになります。ロゴの配置や全体的なビジュアルトーンの確認には Canva:get-design-thumbnail を使用してください。
ワークフロー
ステップ1: デザインを解決する
短縮リンク → Canva:resolve-shortlink / 完全なURL → IDを抽出 / D... 形式の生のID → そのまま使用 / それ以外 → ユーザーに確認する。
ステップ2: ブランドキットを取得する
Canva:list-brand-kitsを実行する。複数ある場合はどれを使うか確認する(またはチーム/コンテキストから推測する)。- キットから取得できた情報(名前、サムネイル、カラー/フォントがあればそれも)を記録する。
- 前述のデータギャップの対応を適用する。スコープが不足している場合(例:「Missing scopes: [brandkit:read]」)は、トークンを更新するためにCanvaコネクターの切断・再接続をユーザーに案内してください。
ステップ3: デザインを読み込む
Canva:get-design-thumbnailでビジュアル・ロゴ・トーンを確認する。- 読み取り専用トランザクション(開始 → 検査 → キャンセル)で使用中の実際のカラーとフォントを取得する。
ステップ4: ブランドと照合する
各項目を確認し、ブランドに沿っている / ブランドから外れている / 確認不可 のいずれかに分類します:
- カラー — 塗り・テキスト・アクセントがブランドパレット内に収まっているか?パレット外のhex値を指摘し、最も近いブランドカラーも示す。
- タイポグラフィ — フォントがブランドフォントと一致しているか?ブランド外のフォントファミリーや、サイズ/ウェイトの不統一を指摘する。
- ロゴ — 期待される位置にあるか、正しいバージョンか、引き伸ばし・色変更・過密配置がないか(サムネイルによるビジュアルチェック)。
- トーン & コピー — テキストの文言が、ユーザーが説明するブランドボイスと合っているか?
- 一貫性 — すべてのページでブランドの適用が統一されているか?
キットからデータが取得できず、ユーザーからも提供されていない場合は、迷わず 確認不可 を使用してください。
ステップ5: レポートを出力する
## ブランドチェック — "<デザインタイトル>" vs "<ブランドキット名>"
総合: ⚠️ ほぼブランドに沿っているが、3件の問題あり
### ブランドから外れている
- [カラー] 2ページ目の見出しが #1A73E8 — パレット外。最近ブランドカラー: #0B5CD7。
- [フォント] 4ページ目の本文にArialが使用されている。ブランドの本文フォントはInter。
### 確認不可(情報提供が必要)
- ブランドキットからhex値が取得できませんでした。正確なチェックのために
パレットとフォントを貼り付けてください。または上記カラーをガイドラインで確認してください。
### ブランドに沿っている
- ロゴの配置とカバーの処理はキットと一致しています。
ステップ6: 修正を提案する
APIで修正可能な問題については canva-edit-design を通じた修正を提案してください。
なお、APIで変更できるのはテキストカラーとフォントのサイズ/ウェイト/スタイルのみです。フォントファミリーや背景色の変更はAPIでは対応できず、Canva上での手動操作が必要です(詳細は canva-edit-design を参照)。
ルール
- 読み取り専用: 検査後は必ず
cancel-editing-transactionを実行すること。コミットは絶対にしない。 - ブランド値を捏造しない: キットの実データまたはユーザー提供の情報のみを使用し、それ以外は 確認不可 と記載する。
- 必ず具体的なページ/要素を名指しし、問題のある値とブランド値を対比して示す。
- ハードな違反(誤ったロゴ、パレット外のカラー)とソフトな違反(わずかにスペーシングが不統一)を区別して報告する。
原文(English)を表示
Brand Checker
Compare a design against the user's brand kit and report, point by point, where it follows the brand and where it drifts. This is a specialised, brand-aware version of canva-design-feedback: same read-only "read the design, then critique" core, but the rubric is the brand kit. It never edits the design.
The brand-kit data gap — read this first
Canva:list-brand-kits is documented to return brand kit IDs, names, and thumbnails. It may NOT return the machine-readable palette (hex values) and font families. Your approach depends on what you actually get back:
- If the kit exposes colors/fonts → use those exact hex codes and font names as the rubric (precise check).
- If it only exposes a thumbnail/name → you cannot do an exact hex/font match. Fall back to a visual comparison against the kit thumbnail, and ASK the user to paste their brand colors (hex) and fonts so you can check precisely. Be explicit that, without those, the color/font findings are approximate.
Never invent brand colors or fonts. If you don't have the real values, say so.
Reading the design's actual colors and fonts
Canva:get-design-content returns text only — not colors or fonts.
- A read-only editing transaction (
Canva:start-editing-transaction→ inspect →Canva:cancel-editing-transaction, always cancel) reliably gives element text, positions, and sizes. - Colors and fonts are NOT reliably exposed by the transaction — tested: it often returns only text + position + dimension, with no color/font attributes. So the thumbnail is your primary evidence for color and typography. Use any style data the payload happens to include, but never assert a design's hex or font as fact unless it was actually in the payload.
Because both the brand kit (see the gap above) AND the design itself frequently lack machine-readable colors/fonts, brand-check is often a visual comparison (design thumbnail vs. brand-kit thumbnail) plus the user-supplied palette/fonts. Use Canva:get-design-thumbnail for logo placement and overall visual tone.
Workflow
Step 1: Resolve the design
Short link → Canva:resolve-shortlink; full URL → extract ID; raw D... ID → use directly; otherwise ask.
Step 2: Get the brand kit
Canva:list-brand-kits. If several, ask which one (or infer from team/context).- Capture whatever the kit exposes (name, thumbnail, and colors/fonts if present).
- Apply the data-gap handling above. If scopes are missing (e.g. "Missing scopes: [brandkit:read]"), tell the user to disconnect and reconnect the Canva connector to refresh the token.
Step 3: Read the design
Canva:get-design-thumbnailfor visual/logo/tone.- Read-only transaction (start → inspect → cancel) for the actual colors and fonts in use.
Step 4: Compare against the brand
Check each dimension and mark On brand / Off brand / Can't verify:
- Color — are fills/text/accents within the brand palette? Flag off-palette hexes (and the nearest brand color).
- Typography — do fonts match brand fonts? Flag non-brand families and inconsistent sizing/weight usage.
- Logo — present where expected, correct version, not stretched/recolored/crowded (visual check from thumbnail).
- Tone & copy — does the wording match the brand voice the user describes?
- Consistency — is brand application consistent across all pages?
Use Can't verify honestly whenever the kit didn't expose the data and the user hasn't supplied it.
Step 5: Report
## Brand check — "<design title>" vs "<brand kit name>"
Overall: ⚠️ Mostly on brand, 3 issues
### Off brand
- [Color] Page 2 heading is #1A73E8 — not in palette. Nearest brand color: #0B5CD7.
- [Font] Page 4 body uses Arial; brand body font is Inter.
### Can't verify (need input)
- Brand kit didn't expose hex values. Paste your palette + fonts for an exact check,
or confirm the colors above against your guidelines.
### On brand
- Logo placement and cover treatment match the kit.
Step 6: Offer to fix
Offer to correct the API-fixable issues via canva-edit-design — note that the API can change text color and font size/weight/style, but CANNOT change font family or background colors (those are manual in Canva; see canva-edit-design).
Rules
- Read-only: always
cancel-editing-transactionafter inspecting. Never commit. - Never fabricate brand values — use the kit's real data or what the user provides, otherwise mark Can't verify.
- Always name the specific page/element and the offending value vs. the brand value.
- Distinguish hard violations (wrong logo, off-palette color) from soft ones (slightly inconsistent spacing).
原文・著作権は Anthropic および各プラグイン作者に帰属します。日本語訳は Claude API による自動翻訳です。