Component

Alert

Notification alerts with semantic colors and clean ink borders. Flat design with subtle background tints.

Default Alert

Information

This is a default alert with the Capsule7 design styling. Clean borders and flat background.

Semantic colors with subtle background tints for different alert types.

Error

Something went wrong. Please check your input and try again.

Success

Your changes have been saved successfully.

Warning

Please review the information before proceeding.

New Feature

Check out our latest updates and improvements!

Click buttons to trigger different alert states.

Alerts with close buttons for user dismissal.

Tip of the day

Press Cmd+K to open the command palette and access quick actions.

Subscription Expiring

Your trial period ends in 3 days. Upgrade now to keep your features.

Toggle connection status to see responsive alerts.

Connected

You are connected to the internet. All features are available.

Smaller alerts for inline notifications.

File uploaded successfully

Invalid file format

Large file may take longer to process

Prop	Type	Default
variant	"default" \| "destructive" \| "success" \| "warning" \| "accent"	"default"