← Back to Dashboard

⏳ Loading & Empty States

Loading indicators, skeletons, empty state design

Loading Spinners

Pending Review

Consistent loading spinners for various contexts - page loads, button actions, and async operations.

Requirements
Consistent spinner animation speed
Multiple sizes (small, medium, large)
Proper color contrast
Smooth animation without janking

Skeleton Screens

Pending Review

Skeleton loading patterns that match the actual content layout to reduce perceived loading time.

Requirements
Matches actual content structure
Shimmer animation effect
Appropriate timing before content
Smooth transition to loaded content

Empty States

Pending Review

Meaningful empty states with clear messaging and calls-to-action when no content is available.

Requirements
Clear illustration or icon
Helpful message explaining the state
Action button to resolve the empty state
Consistent style across all empty states

Progress Bars

Pending Review

Progress indicators for multi-step processes, uploads, and long-running operations.

Requirements
Clear percentage or step indication
Smooth animation between states
Time remaining estimation when applicable
Cancel option for long operations

Error States

Pending Review

Error messaging and recovery options when content fails to load.

Requirements
Clear error message
Retry button or action
Support contact option
Non-technical language

Lazy Loading Indicators

Pending Review

Visual feedback for content that loads as users scroll (infinite scroll, pagination).

Requirements
Loading indicator at scroll boundary
Smooth content insertion
End-of-content message
No layout shift during load