使い方ガイドへスキップ
theSVG作者 glincker

theSVG スキル。

既存のブランドマークやサービスアイコンを、プロジェクトに必要な形式で取得します。

  • ブランドアセット
  • SVG
  • クラウド構成図
ソースレビュー · theSVGSKILL.md
タスク ブランドアセット 成果物 • 依頼されたブランドについて、確認済みのスラッグとバリエーションの選択。 • 用途に合った、すぐに使えるSVGのURLまたは生のマークアップ。 • 必要に応じた、利用権に関する注意と、ブランドが見つからない場合の代替案。 開始前に レジストリまたはCDNへのネットワークアクセスが必要です。React、CLI、Figma、MCPとの連携は任意の利用形態であり、単純なURL取得の前提条件ではありません。
編集部による要約 · ソース確認日 2026-10-07 · 生成された例ではありません

01 機能概要

アセットのパスを推測せずにブランドSVGを探す

予測可能なSVGエンドポイント、バリエーション選択、連携形式、利用権に関する注意を備えた、レジストリベースのブランドアセット取得ワークフローです。

ソースに基づくワークフロー実行ベンチマークではありません

作業の進め方

theSVGは、名前の付いたブランド、フレームワーク、クラウドサービスのための取得用スキルです。レジストリを使ってブランド名やエイリアスをスラッグに解決し、利用可能なバリエーションを確認したうえで、CDN URL、生のSVG、または連携先に応じた形式を返します。新しいロゴのデザインや、汎用のメニューアイコンの選定を行うツールではありません。

ソースでは、自動取得とユーザー向けページへのURL埋め込みを区別しており、エージェントのリクエストにはjsDelivrのエンドポイントを推奨しています。また、利用権の境界も明示されています。リポジトリのMITライセンスは、個々のブランドマークに対する商標上の制限を解除するものではありません。ソースが示すライブラリの規模に頼らず、依頼された各アセットをレジストリで確認してください。

期待される成果物

  • 依頼されたブランドについて、確認済みのスラッグとバリエーションの選択。
  • 用途に合った、すぐに使えるSVGのURLまたは生のマークアップ。
  • 必要に応じた、利用権に関する注意と、ブランドが見つからない場合の代替案。
サンプル依頼を見る

依頼からレビューまで

  1. 01
    ブランドを解決する

    ファイルパスを作り上げるのではなく、タイトルとエイリアスを使って、依頼された名前をレジストリで検索します。

  2. 02
    利用可能なバリエーションを選ぶ

    背景と用途に合わせて掲載されているバリエーションから選び、希望の版がない場合はdefaultにフォールバックします。

  3. 03
    適切な形式で返す

    MarkdownまたはHTMLでの埋め込み、SVGマークアップを提供します。プロジェクトがすでにその連携を使っている場合は、ドキュメントに記載されたReactやCLIの形式を提供します。

  4. 04
    利用権を確認する

    商用利用についてブランドガイドラインを確認し、アセット固有の制限を維持します。

02 利用場面

使う場面

レジストリまたはCDNへのネットワークアクセスが必要です。React、CLI、Figma、MCPとの連携は任意の利用形態であり、単純なURL取得の前提条件ではありません。

適したケース

  • 連携ページ対応する連携先の実際のブランドマークをまとめるのに役立ちます。
  • クラウドアーキテクチャ図AWS、Azure、GCPのサービスアイコンURLを、図の中での役割ごとにグループ化できます。
  • ドキュメント用アセットREADMEや技術ガイドで使うフレームワークや企業のロゴを、一貫した方法で取得できます。

確認すべき制約

  • 汎用UIアイコンではありません矢印、シェブロン、メニューのグリフはUIアイコンライブラリの領域であり、このブランドレジストリの対象ではありません。
  • 商標の使用許諾ではありませんブランドマークは各権利者に帰属します。コードのライセンスは、それらを改変したり組み合わせて新しいアイデンティティを作ったりする許可ではありません。

用意する入力

  • 正確なブランドまたはサービス製品、フレームワーク、企業、クラウドサービスの名前を指定します。
  • 出力先の形式HTML、Markdown、React、生のSVG、またはアーキテクチャ図を指定します。
  • 背景とバリエーション明るい背景か暗い背景かという状況と、シンボルとワードマークのどちらが必要かを伝えます。

03 重要な判断

重要な判断

  1. 推測の前にレジストリを確認

    利用可能なバリエーションを確認することで、もっともらしく見えてもアセットが返らないURLを避けられます。

  2. 配信形式は利用側に合わせる

    マークアップを取得するエージェントと、画像を埋め込むページとで、元のマークを変えずに異なるエンドポイントを使えます。

  3. アセットの権利は別扱い

    ソースでは、ソフトウェアのライセンスと、商標やクラウドアイコンの条件とが明確に区別されています。

04 依頼例

焦点を絞った依頼を試す

以下のサンプル依頼はテストされていません。使用前にスキルのセットアップを確認してください。

セットアップを確認する

リポジトリのスキルのインストール手順を確認してください。ドキュメントに記載された npx @thesvg/cli add コマンドはアイコンアセットを追加するもので、スキルのインストールコマンドではありません。

アップストリームのソースファイル
https://github.com/glincker/thesvg/blob/0ea4d44764ab73c8500382711736f97cba50afc8/skills/thesvg/SKILL.md

レジストリまたはCDNへのネットワークアクセスが必要です。React、CLI、Figma、MCPとの連携は任意の利用形態であり、単純なURL取得の前提条件ではありません。

まずは1つの成果物から

スキルを実行する前に、この依頼の範囲、元資料、制約を自分の状況に合わせて調整してください。

サンプル依頼
thesvgを使って、GitHub、Stripe、AWS Lambda、AWS S3のレジストリアセットを、明るい背景の連携図向けに取得してください。各スラッグと利用可能なバリエーションを確認し、グループ化したSVGのURLと説明的なaltテキストを返し、ブランド使用上の制限を指摘してください。マークの色変更や歪みは行わないでください。

結果を確認する

実際の出力を、以下の観察可能な基準に照らして確認します。

  • 依頼されたすべてのスラッグとバリエーションがレジストリに存在する。
  • アセットが指定された背景上で読み取れる。
  • 成果物が、MITがすべての商標の権利を付与すると示唆していない。

OpenDesignは、コーディングエージェント向けのローカルデザインワークスペースを提供します。この掲載は、スキルが同梱されていること、または外部ツール、認証情報、ソフトウェア依存関係が含まれていることを意味しません。

05 ソースとライセンス

ソースとライセンス

このページは、以下にリンクされた固定のソースリビジョンについて説明しています。アップストリームの動作や要件は変更される場合があります。

ソースの所有者
glincker
リポジトリ
glincker/thesvg
スキルファイル
skills/thesvg/SKILL.md
ライセンス
MIT
確認したスナップショット
2026-10-07 · 0ea4d44764ab
編集部によるソース要約
予測可能なSVGエンドポイント、バリエーション選択、連携形式、利用権に関する注意を備えた、レジストリベースのブランドアセット取得ワークフローです。

リンク先のソースに基づく、OpenDesignによるオリジナルの要約です。リポジトリのスター数は日付時点の人気の指標であり、スキルの利用数や品質スコアではありません。

06 開始前の質問

開始前の質問

オリジナルのロゴを作成しますか?

いいえ。既存の名前付きブランドやクラウドサービスのアセットを取得するものです。ロゴデザインのワークフローは別のタスクです。

暗い背景用の白いロゴを返せますか?

掲載されている適切なバリエーションを選べますが、そのバリエーションがない場合は正直にフォールバックする必要があります。

リポジトリがMITなら、すべてのSVGを自由に編集できますか?

いいえ。ソースは、商標には独自の使用ルールが残ること、またAWSのアーキテクチャアイコンには改変禁止の別個の条件があることを具体的に警告しています。

OpenDesign

次のデザイン反復のための余地をつくりましょう。

依頼内容、元資料、デザイン作業をローカルワークスペースにまとめて管理できます。ワークフローに追加する前に、スキル自体のセットアップを確認してください。

アップストリームのソースファイル
https://github.com/glincker/thesvg/blob/0ea4d44764ab73c8500382711736f97cba50afc8/skills/thesvg/SKILL.md