Feedback & Status

Components that communicate state, status, progress, and system messages to users. From lightweight badges to full modal dialogs.

Badge / Tag

Small labels used to communicate status, category, or count. Available in five semantic variants.

Variants

Default Primary Success Warning Error

Inline messages that highlight important information, warnings, or errors within the page flow.

Variants

Information

Your workspace has been updated to the latest version. Review the changelog for details.

Success

All changes have been saved and deployed to production successfully.

Warning

Your API rate limit is at 85%. Consider upgrading your plan to avoid interruptions.

Error

Failed to connect to the database. Please check your credentials and try again.

Ephemeral, non-blocking notifications that appear at the bottom-right corner and auto-dismiss after 4 seconds.

Trigger demos

A focused dialog that overlays the page, used for confirmations, forms, or critical actions that require user attention.

Demo

Contextual hints that appear on hover after a short delay. Available in top, right, and bottom positions.

Hover to reveal

Linear indicators for determinate and indeterminate loading states. Thin, minimal, and color-coded to the brand.

Variants

Determinate — 65%

65%

Indeterminate

Pulse

Placeholder shapes that mimic the layout of content while it loads. Keeps the page structure stable and reduces perceived wait time.

Examples

A friendly message shown when a view has no content. Guides users toward a next action.

Example

No documents yet

Create your first document to get started. You can write, collaborate, and share with your team.