Skip to content
Pinky UI

Inline Feedback

Use for a small local response beside the field or action that caused it.

Live example

Try the interaction before reading the recipe.

real component · keyboard-safe

Saved locally

Purpose

Use for a small local response beside the field or action that caused it.

Use when

The user needs to know that a value saved, copied, failed validation, or recovered.

Avoid

Global announcements for local changes or messages that disappear before they can be read.

Accessibility

Use status for non-urgent confirmation and alert for errors; associate invalid text with the control.

Keyboard and touch

Dismiss and recovery controls must be native buttons and remain reachable without pointer hover.

Reduced motion and performance

Keep layout stable and avoid per-keystroke animation; state changes should remain immediate.

Composition and anti-patterns

Escalate to Toast or Undo Bar only when the user has left the local context.

Source: packages/skills/feedback/inline-feedback.md