Interfaces that bounce back
Plonk is a toy-grade physics engine for product teams. Springs, collisions and cursor forces — tuned by hand so every pixel feels like it has a heartbeat.
Motion you can feel, not just watch
Most animation libraries play a clip. Plonk simulates a tiny world. Every button, card and character in your product gets mass, drag and springiness — so when someone touches it, it answers honestly.
It ships as a 12kb runtime with a declarative API. Describe the forces, and Plonk keeps everything at a silky 60fps, even on last year's phone.
Four forces. Infinite mischief.
Compose them like Lego bricks. Every force is tweakable in real time from the inspector.
Springs
Critically-damped or delightfully wobbly. Attach anything to anything and let tension do the storytelling.
Cursor fields
Attract, repel or swirl elements around the pointer. Hover states that feel less like CSS, more like weather.
Collisions
Broad-phase, batched and boring under the hood — so the bouncing on top can be anything but.
Choreography
Sequence formations and flocking with a timeline API. One line to send a hundred spheres into a heart.
Break the laws of physics. Politely.
The Plonk Playground runs entirely in your browser. Fork a preset, drag some sliders, and ship the export straight into your codebase.
Launch playground — it's freeTeams that plonked and never went back
Our onboarding completion went up 31% the week we added Plonk micro-physics. Users just… kept poking things. In a good way.
I replaced 400 lines of hand-rolled spring math with six Plonk declarations. My code review was just the word "finally".
The playground is where our design reviews happen now. We argue about damping ratios like it's a sport.