Every time I started a new React or Next.js project, I found myself writing the same skeleton/shimmer loading component from scratch. Copy-paste from old projects, adjust the CSS, fix the types… again and again.
So I packaged it once and published it.
Meet skeletonix — a plug-and-play skeleton loader for React & Next.js.
What it does
- Smooth shimmer animation, no setup
- Shortcut props for common patterns: text, circle, block
- Full TypeScript support
- Customizable colors and animation speed
- Dark mode ready via CSS variables
- ~3KB bundle, zero external dependencies
- Styles are auto-injected — no CSS import needed
Install
npm i skeletonix
I didn’t want another heavy UI library just for skeleton loaders. I wanted something:
- Under 5KB
- Zero config
- Type-safe
- That works in both React and Next.js without extra setup Now it exists.
Links
📦 npm: https://www.npmjs.com/package/skeletonix
💻 GitHub: https://github.com/MiladJoodi/Skeletonix
If it saves you 10 minutes on your next project, give it a ⭐ on GitHub.