Image Dragging Effects

A set of playful dragging effects for images using various techniques.


Today we’d like to share a little set of playful dragging effects with you. The idea is to animate images as they are being dragged, and distort, scale or apply filters to them. For some examples we tie the intensity of the effect to the speed of the dragging motion.

The inspiration for these effects come from two Dribbble shots by Zhenya Rynzhuk:

Here’s a short video of all effects:

We hope you like these ideas and find them useful!

References and Credits

Tagged with:

Manoela Ilic

Manoela is the main tinkerer at Codrops. With a background in coding and passion for all things design, she creates web experiments and keeps frontend professionals informed about the latest trends.

Stay in the loop: Get your dose of frontend twice a week

👾 Hey! Looking for the latest in frontend? Twice a week, we'll deliver the freshest frontend news, website inspo, cool code demos, videos and UI animations right to your inbox.

Zero fluff, all quality, to make your Mondays and Thursdays more creative!

Feedback 4

Comments are closed.
  1. Hello this is amazing work. Thank you. I have downloaded the source but doesn’t seem to work. It just pulses. Can you please re-upload or tell us how it can work Thank you

    • Hi Sarah, thanks for your message. I’ve just tested it again and it seems to be OK on my side. Have you run “npm install” and then “npm start”? Any errors you see in the console? Thanks.