Loaders

Inline React loading indicators for images, content placeholders, buttons, and panels.

Skeleton Loader preview

Reusable skeleton loader with rounded shapes and a quiet reduced-motion shimmer.

Spinner Component preview

Thin inline loading spinner sized for buttons, cards, and compact panels.

About Loaders Components

Loader components keep layouts stable and make short waits understandable. This collection includes image loading, skeleton placeholders, and compact inline spinners.

Use the smallest loader that fits the task, keep useful content visible, and preserve reduced-motion and screen-reader feedback.

Frequently asked questions

When should I use an inline loader?

Use an inline loader when one image, button, card, or panel is waiting while the rest of the page remains available.

When should I use a skeleton loader?

Use a skeleton when the final content layout is known and preserving its shape will reduce visual movement while data loads.

Are these loaders accessible?

Yes. The components support loading announcements and reduced motion. Keep labels specific to the task when you adapt them.