An interactive photo
Squish my face.
Go on. It's not going to squish itself.
Drop in a photo, grab a cheek, pull it out, let go. It takes about ten seconds, and nothing leaves your browser.
No uploads. No account. No idea what you look like.
← drag the cheek
Three seconds to get it.
Ten to make one.
Pick a face.
JPG, PNG, or a cut-out with a transparent background. The cut-out wins — the head can leave the circle.
Grab it.
Mouse or finger. Whatever skin is under your cursor comes with you, and it brings its neighbours.
Let go.
It wobbles back on its own. Save five seconds of it, or send it to someone who deserves it.
What makes a good face
- Head and shoulders, roughly square. A passport photo beats a holiday photo.
- Straight on. Save the artsy angle for your actual profile picture.
- A transparent PNG cut-out looks the most alive, because the head can pop outside the circle.
- No sunglasses. Half the fun is the eyes.
No photo handy?
Meet the faces
Wobbly
The original. Easily amused.
Clingy
It follows your cursor. It always follows your cursor.
Overreactor
Do not pull the cheek. (Please pull the cheek.)
Shy
Give it some space. It can tell.
Things he does when you're not looking
Leave the page alone for a few seconds and he gets bored. All of it is the same engine — no video, no keyframes.
Yawns
Four frames, one big mouth, and a head that nods off at the end of it.
Whistles
Notes drift off to the side. He rocks a little. He thinks you can't hear him.
Rolls his eyes
Fifteen glances in under a second, cut not faded, the way real eyes jump.
Dozes off
Lids droop, he loses the fight, his head sinks — then something wakes him up.
Gets his cheek pulled
By a hand that isn't yours. Same physics as your own grab, same spring.
Fights a fly
The fly lands on his nose. He blows at it. It comes back. Twice.
Watching the cursor is the other half: the eyes are separate patches on a sheet, so he can follow your mouse without his face moving. How that works →
It's not a filter
Filters move pixels around on a flat picture. This is a mesh: your photo is cut into about ten thousand points, and each point is tied to its neighbours and to where it started.
Pull one and the pull travels — that's the wave you see run across the cheek. The wobble after you let go is the same wave running out of energy. Nothing is pre-recorded, so no two pulls look the same.
Put it on your site
One small script with no dependencies. No Three.js, no framework, no 80MB of anything — about 26KB over the wire. It renders in one WebGL draw call and stops simulating when nothing is moving.
There's a licence for using it in your own hero, portfolio or about page.
Questions, answered anyway
Is it free?
Yes. No account, no watermark, no “pro” button that hurts.
Where do my photos go?
Nowhere. The whole thing runs in your browser. There's no upload, no server, and nothing to delete.
What photo works best?
A head-and-shoulders shot, roughly square. A PNG cut-out with a transparent background looks best, because the head can leave the circle.
Does it work on my phone?
Yes. Press and hold to grab, then drag sideways. Swipe up or down to scroll the page as usual.
Can I use it on my site?
Yes. It is one small script with no dependencies, and there is a licence for that. Details.
Why does my cat look wrong?
Cats have no cheeks to speak of. It still works. It just looks like a very surprised cat.
Why is he yawning at me?
He does that when the page has been quiet for a few seconds. It's not a hint.
Is this like when your auntie pinches your cheeks?
Sort of. But squishier.
Still here?
Just squish the face. It's been very patient.