---
title: "Spring Image"
url: "https://sanyam.sh/lab/spring-image"
date: "2025-08-11"
---

# Spring Image

a draggable profile image with smooth spring physics using Framer Motion's `useMotionValue` and `useSpring` hooks.

key insight: using `useMotionValue` for base position values, `useSpring` for smooth physics, and `dragConstraints` to limit drag area. the placeholder appears during drag/animation states to maintain layout stability.

combines `drag`, `whileDrag`, `onDragStart/End` with spring physics for natural feel. the `setTimeout` ensures placeholder visibility matches spring animation duration.

- Source: https://x.com/sanyampunia/status/1954901980180254787