コンポーネント

読み込み中・無効状態を備えた主要アクション。

必ずアクセシブルな名前を持つアイコン専用ボタン。

移動先を明確に伝えるセマンティックなリンク。

状態や分類を短く示すラベル。

ラベル、補足、エラーを関連付けた一行入力。

長文入力のためのラベル付き複数行フィールド。

複数選択に使う二値の選択肢。

設定を即時に切り替えるオン・オフ操作。

名前付き候補から一つだけ選ぶグループ。

ラベルとエラーを備えたネイティブ選択欄。

フォーカスを管理し、Escapeで閉じられるモーダル。

取り消せない操作を安全に確認する警告ダイアログ。

現在の文脈を保ったまま補足を開く非モーダル面。

操作対象へ短い補足説明を加える表示。

キーボード操作に対応したアクションメニュー。

関連する表示を同じ階層で切り替えるタブ。

必要な箇所だけ展開できる開閉リスト。

現在地までの階層を示すナビゲーション。

ページ位置を通知しながら前後へ移動する操作。

関連内容を一つの面にまとめるコンテナ。

重要なヒントや注意を本文内で強調する領域。

読み込み後の形状を先に示すプレースホルダー。

完了時刻が未定の処理を示す進捗表示。

処理の完了割合を示す進捗バー。

操作結果を一時的に知らせるステータス通知。

内容がない理由と次の行動を示す空状態。

失敗内容と回復手段を示すエラー状態。

トークン化した間隔で縦に並べるレイアウト。

折り返し可能な横並びレイアウト。

画面幅に適応する自動グリッド。

読みやすい最大幅に内容を収めるコンテナ。

視覚表示を増やさず支援技術へ文脈を渡すテキスト。