Multi Step Loader
A step loader for screens that take a lot of time to load.
Installation
Run the following command
npx shadcn@latest add @aceternity/multi-step-loaderProps
| Prop Name | Type | Default Value | Description |
|---|---|---|---|
| loadingStates | LoadingState[] | N/A | An array of objects, each with a text property to display the current loading state message. |
| loading | boolean | undefined | A boolean to control whether the loader is active or not. |
| duration | number | 2000 | The duration (in milliseconds) before transitioning to the next loading state. |
| loop | boolean | true | A boolean to control whether the loading states should loop back to the start. |
| value | number (optional) | 0 | (Only in LoaderCore) The current index of the loading state to be displayed. |
Build websites faster and 10x better than your competitors with
Aceternity UI Pro
Next.js 15, Tailwind CSS v4 and Motion for react powered templates
200+ templates and blocks combined
Ready to copy paste component blocks, save days of development time
