Coach Mark
Use for one dismissible teaching hint attached to a relevant element.
Live example
Try the interaction before reading the recipe.
real component · keyboard-safe
Rest
Active
Coach Mark · one controlled state
Purpose
Use for one dismissible teaching hint attached to a relevant element.
Use when
A new feature needs a short explanation in its local context.
Avoid
Multiple competing marks or an uncloseable interruption.
Accessibility
Give the mark a readable status/description and a dismiss button.
Keyboard and touch
Placement must not depend on hover; controls remain reachable on small screens.
Reduced motion and performance
Update position only on meaningful resize/layout events and skip decorative movement.
Composition and anti-patterns
Escalate to SpotlightTour only when several relationships must be taught.
Source: packages/skills/onboarding/coach-mark.md