Drag & physics
Physics playground
Every child becomes a body: they fall, collide, push each other and can be grabbed and thrown.
Paste it into ChatGPT, Claude, Cursor or v0.
Usage
import { PhysicsWorld } from '@vizzele/react';
<PhysicsWorld gravity={{ x: 0, y: 2000 }} restitution={0.55} style={{ height: 480 }}>
{tags.map((t) => <span key={t} className="ball">{t}</span>)}
</PhysicsWorld>Props
| Prop | Type | Default | Description |
|---|---|---|---|
gravity | { x: number; y: number } | { x: 0, y: 2000 } | px/s². |
restitution | number | 0.5 | Bounciness 0–1. |
drag | number | 0.08 | Air drag per second. |
friction | number | 0.3 | Rolling friction on walls. |
interactive | boolean | true | Grab and throw bodies. |
worldRef | Ref<PhysicsWorld> | — | impulse(x, y), setGravity(), wake()… |
Accessibility
- Decorative toy: keep important content out of it, or mirror it elsewhere.
- Reduced motion: the world settles instantly into a still pile.
- Sleeps (zero CPU) once everything is at rest.