Pattern
Callouts and notes
Call attention without turning every important detail into an alarm.
When to use
- When a warning, note, or implementation caveat deserves isolation
- When the page needs a change of mode from normal prose
Avoid when
- When callouts start replacing paragraph structure
- When the visual treatment is louder than the content
Implementation notes
- Use consistent variants and keep them semantically distinct
- Limit the number of callout styles
- Avoid bright error colors for neutral editorial notes
Recommended surface: muted