Proportional Scale

Proportional Scale

About Proportional Scale

When you create and animate a component in Framer, it does not scale properly with its parent container??

Even if you:

  • Set width to Fill

  • Use constraints

👉 Scaling based on the parent width often breaks your animation and layout.

⚠️ The Problem

  • Animations distort when resized

  • There is no native functionality that allows html elements to be scaled like how we scale images

  • Layout proportions get messed up

  • Responsive behavior is inconsistent

Framer doesn’t provide true proportional scaling for animated components.

✅ The Solution

Our Component fixes this.

You can:

  1. Design and animate your component normally in Framer

  2. Wrap it inside our component

  3. Done, now the html/framer component scales like how images scale (Fit Property most likely)

👉 Your animation will scale perfectly without breaking