Morphing Shape Loader
A loading indicator that continuously morphs between configurable SVG shapes via real path interpolation. The transition is a genuine geometric morph — never a fade out / in.
Loading
Installation
Add the component directly to your repository using shadcn CLI:
npx shadcn@latest add Surajmaurya1/easyui/morphing-shape-loader
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| shapes | ShapeKind[] | ['circle','square','triangle','circle'] | Ordered list of shapes to cycle through |
| duration | number | 1.6 | Morph duration per shape change in seconds |
| holdDuration | number | 0.4 | Hold duration at each shape in seconds |
| loop | boolean | true | Loop the shape sequence |
| size | number | 96 | Loader size in pixels (square) |
| color | string | '#FAFAFA' | Stroke or fill color |
| filled | boolean | false | Filled variant instead of stroke |