フィードバック
トースト
Toast
画面の端に短時間表示されるフィードバックメッセージ。操作の成功・失敗・情報を短く伝える。一定時間後に自動的に消える。
別名 2件
アラート
Alert
説明
エラー・警告・成功・情報など重要な状態をページ内に固定表示するコンポーネント。トーストと異なりユーザーが閉じるまで表示を維持する。
別名・呼称
コールアウト(Callout)インラインアラート(Inline Alert)
デザインスタイル別 live preview
インフォ
情報提示用の青いアラート。お知らせ・ガイダンスに使用する標準スタイル。
サクセス
操作成功を伝える緑のアラート。保存完了・送信成功などのフィードバックに。
ワーニング
注意喚起の黄色いアラート。重要な警告・注意事項の表示に。
エラー
エラー表示の赤いアラート。バリデーションエラー・操作失敗の通知に。
ソリッド
ベタ塗りのインパクト強いスタイル。重要度の高いメッセージに。4種のバリアント付き。
レフトボーダー
左側に太い色付きボーダーを配したスタイル。Notionやドキュメント系UIでよく見られる。
ダーク
ダークテーマ向けの暗いアラート。ダッシュボード系UIに自然に溶け込む。