Three dots hop in turn, squashing when they land and stretching in the air, with a shadow on the ground that shrinks as they rise.
Loading assets
212 of 480 textures
npx shadcn@latest add https://hyperblur.dev/r/loader-jumping-dots.jsonWorks in any React project set up with the shadcn CLI. The file lands in components/hyperblur/loader-jumping-dots.tsx.
import { LoaderJumpingDots } from "@/components/hyperblur/loader-jumping-dots"
<LoaderJumpingDots size={18} height={34} />| Prop | Type | Default | Description |
|---|---|---|---|
| size | number | 16 | Dot diameter in pixels. |
| height | number | 30 | How high the dots jump, in pixels. |
| color | string | "#2f7bff" | Dot color. Highlight and shadow derive from it. |
| speed | number | 0.9 | Seconds for one jump. |
| label | string | "Loading" | Text announced to screen readers. |