Skip to content
Pinky UI

Notification Hierarchy

Choose the smallest feedback surface that matches consequence and context.

Live example

Try the interaction before reading the recipe.

real component · keyboard-safe

Quiet support
Primary response

Notification Hierarchy · attention follows consequence

Purpose

Choose the smallest feedback surface that matches consequence and context.

Guidance

Use Inline Feedback beside a local field/action, Status Pill for persistent object state, Toast for brief global acknowledgement, and Action Undo Bar for reversible recovery.

Accessibility and anti-patterns

Do not make every message a toast, repeat the same announcement in multiple live regions, or hide recovery behind a timeout.

Source: packages/skills/patterns/notification-hierarchy.md