ScrollVelocityWarp

Show Preview
ScrollVelocityWarp

About ScrollVelocityWarp

ScrollVelocityWarp is something I built because I kept seeing this elastic skew effect on every top-tier agency portfolio and couldn't find a single Framer component that did it right. So I made one.

Wrap it around any layer image, text, section, card and it reads your scroll velocity in real time. Scroll fast and the content leans forward. Slow down and it eases back. Stop and it snaps to normal with a satisfying spring.

Everything is tunable from the properties panel. Crank the intensity for dramatic warps, dial it back for a subtle professional lean. Adjust the spring physics until it feels exactly right for your site.

Features

  • Wraps any layer images, text, sections, components

  • Real-time scroll velocity via Framer Motion's native hooks

  • Spring physics snap-back stiffness, damping and mass all tunable

  • Skew on Y-axis (vertical lean) or X-axis (horizontal lean)

  • Corner radius with proper overflow handling no clipped corners

  • Native border and shadow controls

  • Clean branded placeholder in canvas when no slot is connected

  • Zero extra dependencies uses only what Framer already ships

Works great on

  • Hero images and full-bleed sections

  • Feature cards and product screenshots

  • Portfolio sites with a creative edge

  • Any page that deserves a little life

Property Controls
Property Controls