Core Elements
Skeleton
A pulsing placeholder shown while content is loading.
Usage
Installation
npm install @wunderui/reactThen import what you need:
import { Skeleton } from "@wunderui/react"Examples
Text
A line of body text while it loads.
Title
A heading while it loads.
Avatar
A round placeholder for a picture.
Block
A card, image or chart area while it loads.
In context
How the component is used inside real screens — the same compositions as the Usage section of the Figma page.
Dashboard skeleton
A full dashboard while its data loads — sidebar, header, KPI row, chart and table as placeholders. Reload to watch the content fade in over the same layout.
Loading…
Loading table
Table rows pulse while the data loads.
Table skeleton
A header row and rows with avatar placeholders.
KPI skeleton
Four stat cards while the numbers load.
List skeleton
A list of people while it loads.
Chart skeleton
A chart card while the data loads.