Feedback
Skeleton
Gray placeholder shapes that show the layout of content while it loads.
Demo
How to recognize it
Light gray circles and bars where images and lines of text will appear, often with a soft shimmer moving across them.
Behavior
- Replaced by the real content when loading finishes.
- Because the layout appears right away, the page feels faster and does not jump when the content arrives.
- The gray shapes are hidden from assistive technology, and the area is marked aria-busy while loading.
Keyboard
| Key | Action |
|---|---|
| — | None. The demo’s reload button uses Enter / Space. |
Similar components
- Spinner: A skeleton previews the layout of the content; a spinner is one shape that only shows something is loading.
Sources
- MUI: Skeleton (Last checked: )
- Carbon Design System: Loading (Last checked: )