Loading Screen
Display while the app is loading the content to render. This component provides a consistent loading experience across your application with theme-aware colors.
Overview
- size
- large · medium · small · tiny
All options
Both LoadingScreen and LoadingSmall use the text-primary color for consistency across light and dark modes.
LoadingScreen
Full-screen loading indicator with fixed 48px spinner size.
LoadingSmall sizes
large (24px)
medium (24px)
small (20px)
tiny (16px)
Examples
Usage in context
Loading data...
Processing
Accessibility
Screen readers
Both LoadingScreen and LoadingSmall render with role="status" and aria-label="Loading".
Props
| Prop | Type | Required | Description |
|---|---|---|---|
| size | 'large' | 'medium' | 'small' | 'tiny' | No | — |