良い質問ですね！
バッジは通常、約14x14、16x16、または56x56ピクセルで表示されます。
サイズは、要素のフォントサイズに対する相対的なものであるため、変動する可能性があります。
しかし、目標とする基本的なサイズを把握するのに役立ちます。
また：
- 1:1の比率
- スケーリングにはSVG、大きな画像には透明なPNGを使用します。表示したい内容によって異なります。
- 配色についてはダークモードを考慮してください。
- 必要に応じてバッジの種類を考慮してください。
- 小さなサイズでどのように表示されるかを考慮してください。
現時点で思いつくのは以上です。
カスタムSVGアイコンを作成することも検討できます。もし私の理解が正しければ。そうすれば、適切な色でうまくスケーリングされ（後で変更するのも簡単です）。
お役に立てば幸いです。