フィードバック
トースト
Toast
画面の端に短時間表示されるフィードバックメッセージ。操作の成功・失敗・情報を短く伝える。一定時間後に自動的に消える。
別名 2件
Alert
エラー・警告・成功・情報など重要な状態をページ内に固定表示するコンポーネント。トーストと異なりユーザーが閉じるまで表示を維持する。
情報提示用の青いアラート。お知らせ・ガイダンスに使用する標準スタイル。
操作成功を伝える緑のアラート。保存完了・送信成功などのフィードバックに。
注意喚起の黄色いアラート。重要な警告・注意事項の表示に。
エラー表示の赤いアラート。バリデーションエラー・操作失敗の通知に。
ベタ塗りのインパクト強いスタイル。重要度の高いメッセージに。4種のバリアント付き。
左側に太い色付きボーダーを配したスタイル。Notionやドキュメント系UIでよく見られる。
ダークテーマ向けの暗いアラート。ダッシュボード系UIに自然に溶け込む。
Toast
画面の端に短時間表示されるフィードバックメッセージ。操作の成功・失敗・情報を短く伝える。一定時間後に自動的に消える。
Spinner
非同期処理や読み込み中であることをアニメーションで示すコンポーネント。ローディング・インジケーター・プログレスとも呼ばれる。
Skeleton
コンテンツ読み込み中にレイアウトの骨格をアニメーション表示するプレースホルダーコンポーネント。スピナーより体感速度が速く感じられる。
Empty State
データが存在しない・検索結果が0件などの状態を伝えるUIコンポーネント。イラスト・説明文・アクションボタンで構成される。