Feedback Components Demo

Alert Component

Display important messages to users with interactive dismiss functionality.

Information: This is an informational alert with fade-in animation.

Success! Your changes have been saved successfully. Click the X to dismiss this alert.

Warning: This alert can be dismissed by clicking the close button.

Error: Something went wrong! This alert features both animation and dismiss functionality.

Show task completion and loading states.

Basic Progress25%

Gradient Progress50%

Animated Striped Progress75%

Large Progress Bar90%

File Upload Progress

63% complete (63MB of 100MB)

Loading indicators for async operations.

Small

Medium

Large

White

Loading States

Loading user data...

Processing your request...

Saving...

Small labels for status and categories.

DefaultPrimarySuccessWarningDangerGradient

Sizes:

XSSmallBaseLargeXL

Special Effects:

AnimatedOutlineAnimated GradientOutline Animated

Premium Plan

Full access to all features

Active