複数のバッジエンドポイント形式
バッジは、/npm/{package}、/github/{owner}/{repo}、/discord/{serverId}、/skills/{owner}/{repo}/{skill}、/badge/{label}-{message}-{color} などのシンプルで文書化されたURLパターンから配信されます。
shieldcn
shieldcnは、READMEやドキュメント向けにshadcn/ui風ボタンのバッジを生成。npm、GitHub、DiscordなどのURL直指定に対応し、PNG、SVG、JSONで出力できます。
shieldcnの機能
shieldcnは、README、ドキュメント、そして画像URLを受け付ける同様の場所向けのバッジ生成・エンドポイントサービスです。shadcn/ui 風のボタンとして見えるバッジを提供し、npm、GitHub、Discord、Homebrew、Tokscale、skills.sh、static、dynamic JSON バッジ向けに予測しやすいパスで公開します。
この製品は、基本的な利用にAPIキーやビルドステップを必要としない、shields.io のドロップイン代替として設計されています。.png と .svg の出力に対応しており、ドキュメントでは生データや shields.io 互換性のための .json と /shields.json レスポンスも説明されています。
機能
柔軟なレスポンス形式
各バッジは .png または .svg でレンダリングでき、.json と /shields.json は生データまたは shields.io 互換データ用に利用できます。
詳細なビジュアルカスタマイズ
バッジは shadcn Button のバリアント、サイズオプション、テーマ、フォント、色、アイコンの上書き、ラベルとレイアウトの制御に対応し、さらに pulse、glow、shimmer といった SVG 専用のアニメーション効果も利用できます。
アイコン処理と上書き
アイコンはプロバイダーごとに自動検出されますが、ドキュメントでは Simple Icons の slug、React Icons の名前の明示、アイコン無効化、カスタム SVG データURIの指定も可能です。
リポジトリ対応のバッジ生成
ジェネレーターは GitHub リポジトリURLからスタックを自動検出し、README で使えるコピペ用のバッジマークアップを出力できます。
ユースケース
オープンソースプロジェクト向けの README バッジ
画像URLを直接使って、npm、GitHub、Discord などのバッジをプロジェクトの README に追加します。ドキュメントでは、GitHub README ではクライアント間でより一貫して表示されるため PNG が特に推奨されています。
リポジトリ対応のバッジ生成
GitHub リポジトリURLからバッジを生成し、ツールにスタックを検出させたうえで、生成された markdown または画像URLをドキュメントやリポジトリページに貼り付けます。
ドキュメントサイトと製品ページのバッジ
画像タグを受け付ける製品ドキュメント、ランディングページ、社内ドキュメント向けに、ボタンやステータス風バッジを作成します。
カスタムおよび動的なステータスバッジ
単一のパッケージやリポジトリのメトリクスに紐づかないバッジが必要な場合に、static、dynamic JSON、group、カスタムの各バッジエンドポイントを使います。
形式別の配信
表示要件に応じて PNG と SVG を切り替え、幅広い互換性には PNG、スケーラブルな出力や SVG 専用のアニメーション効果が欲しい場合は SVG を使います。
skills.sh とプロフィールバッジのワークフロー
skills.sh リポジトリ向けのスキルインストールやランキングのバッジ、またはユーザー名ベースのフローから個人の README ページ用プロフィールバッジを生成します。
Pros and Cons
Pros
- npm、GitHub、Discord、X/Twitter、Homebrew、Tokscale、skills.sh など、多くの一般的な開発者向けバッジソースをカバーしています。
- 一般的な shields.io 風ではなく、shadcn/ui のボタンスタイルに一致しています。
- PNG と SVG の両方に加え、生の JSON と shields.io 互換の出力もサポートしています。
- バリアント、サイズ、フォント、テーマ、色、アイコン、レイアウトオプションなど、広範なビジュアル制御が可能です。
- 静的バッジと基本的なバッジ生成にはAPIキーが不要です。
Cons
- ドキュメントには多くのエンドポイント種別とパラメータがあるため、URLの全体像を把握するまでに時間がかかる場合があります。
- アニメーション効果のような一部の高度なオプションは SVG 専用です。
FAQ
shieldcnではどのようなバッジを生成できますか？
READMEやドキュメントのような、画像URLを受け付ける場所向けのバッジ画像を生成します。たとえば、npm、GitHub、Discord、X/Twitter、Homebrew、Tokscale、skills.sh、static、dynamic JSON、flag、grouped の各バッジ用エンドポイントが用意されています。
GitHub リポジトリURLからバッジを生成できますか？
はい。ジェネレーターページは、GitHub リポジトリURLまたは owner/repo の入力によるリポジトリ用バッジに対応しており、プロフィール用バッジの生成はユーザー名ベースのフローにも対応しています。
shieldcnはどの出力形式に対応していますか？
はい。ドキュメントでは .png と .svg の両方がサポートされており、どのエンドポイントも .json あるいは /shields.json 経由で shields.io 互換の形式として取得できます。
shieldcnを使うのにAPIキーやセットアップは必要ですか？
基本的なバッジURLの利用には、設定、APIキー、ビルドステップは不要だとドキュメントに記載されています。
Quick Facts
- Category
- 開発者ツール
- Primary use
- README とドキュメント用バッジ
- Output formats
- PNG, SVG, JSON
- Supported workflow
- 直接エンドポイントまたはバッジジェネレーターによるURLベースのバッジ生成
- Source domain
- shieldcn.dev
- Pricing
- 無料・オープンソース
shieldcnの代替品
ByteAsk
ByteAskは、C/C++向けのターミナル起点AIコーディングエージェント。リポジトリを編集し、コンパイラやデバッガ、サニタイザ、テストで変更を検証してから差分を表示。無料枠あり。
CreateOS Sandbox
CreateOS Sandboxは、FirecrackerマイクロVM上でコードやエージェントのワークロードを実行できる分離型コンピュート環境です。SDK、CLI、MCPで制御可能。
hob
hobは、エージェントのセッション、ターミナル、履歴、後続作業を、既存のツールやプロバイダーに合わせて整理できる独立したコーディングエージェント向けワークスペース。ローカルでの制御を重視する開発者に最適。
Ably Chat
Ably Chatは、カスタムのリアルタイムチャットアプリを構築できるチャットAPIプラットフォームです。ルーム単位のメッセージ、入力中表示、プレゼンス、リアクション、メッセージ更新に対応し、利用量ベースの料金も選べます。
Manta AI
Manta AIは、URLからアプリの挙動を把握し、回帰を検出し、スクリプトやセレクタ管理なしでテストを生成できる自律型Webアプリテストツールです。
SonOf
SonOfは、リポジトリとPMツールに接続し、コードベースと周辺の製品コンテキストを監査して、承認済みの作業をシニアエンジニアのレビュー付きで公開済みチケットに変えます。