Feedback

Ways to tell a reader what is happening — the callouts, loaders, bars, rings, gauges, and placeholders you reach for while something is in progress (or has just finished). Most are a single Markdown tag with no setup; two of them — the top-of-page bar and the toasts — are driven from JavaScript instead, and each shows a live demo you can click.

• Callout — titled admonitions in four severities.
• Loader — a spinner in three styles (oval, bars, dots).
• Navigation progress — a thin top-of-page bar you drive from JavaScript.
• Notification — a titled message card with a colored accent line.
• Notifications — a toast system you trigger from JavaScript; the call pops a message into a viewport corner.
• Progress — a progress bar, single-value or multi-segment.
• Ring progress — a circular donut ring with one or more colored sections and a center label.
• Semi-circle progress — a half-circle gauge with a center label.
• Skeleton — a shimmering placeholder for content that hasn’t loaded.