Component Gallery

Glossary

バッジとタグの違い

Badge vs Tag

30秒でわかる要点

バッジは状態や件数を短く示し、タグやチップは分類・属性・選択済み条件を示すために使います。

使い分けのポイント

  • ・バッジはステータスや数値に向く
  • ・タグは分類やラベル付けに向く
  • ・チップは選択や削除操作を伴うことがある

関連コンポーネント

バッジ（Badge）バッジ（Badge）は、数量・ステータス・ラベルを小さいサイズで表示するコンポーネント。通知数や状態の強調表示に使用される。タグ（Tag）タグ（Tag）は、コンテンツの分類・属性を示すラベルコンポーネント。削除可能・クリック可能なバリアントを持つ場合もある。バッジより情報量が多く、一覧での絞り込みにも使われる。

運営・更新・参照元

最終更新日
2026-07-16
レビュー状態
未レビュー

参照元

FAQ

バッジとタグの違いはどう使い分けますか？

バッジは状態や件数を短く示し、タグやチップは分類・属性・選択済み条件を示すために使います。 実装時は、ユーザーが何を判断・入力・移動したいのかを基準に選びます。

バッジとタグの違いでよくある誤解は何ですか？

バッジはステータスや数値に向く

バッジとタグの違いをチームで統一するには？

デザインシステムやUI用語集で推奨名、別名、使う場面、使わない場面を明記し、画面レビュー時に同じ呼称を使います。