Resources

Scroll Rotation Animation in Framer

View demo

Remix project

Remix project

Resources

Scroll Rotation Animation in Framer

View demo

Remix project

Nandi Muzsik

How can I improve Framer Uni?

Let me know if there’s a missing feature or something that could be improved.

Share feedback

Nandi Muzsik

How can I improve Framer Uni?

Let me know if there’s a missing feature or something that could be improved.

Share feedback

Animation

Scroll Rotation Animation in Framer

This is a Framer rebuild of the scroll rotation animation originally seen on the Rainbow website. Feel free to remix the project, delve into it, and see how it's put together.

image of Nandi Muzsik

Created by

Nandi

Scroll Rotation Animation in Framer
Scroll Rotation Animation in Framer
Scroll Rotation Animation in Framer

About the resource

The effect is actually simpler than you might think. All we do is rotate the containers of the logos using a scroll transform. The 'from' state starts with opacity 1 and scale 1, and then the 'to' state introduces a neat little rotation. Yep, that's all there is to it.

About the resource

The effect is actually simpler than you might think. All we do is rotate the containers of the logos using a scroll transform. The 'from' state starts with opacity 1 and scale 1, and then the 'to' state introduces a neat little rotation. Yep, that's all there is to it.

About the resource

The effect is actually simpler than you might think. All we do is rotate the containers of the logos using a scroll transform. The 'from' state starts with opacity 1 and scale 1, and then the 'to' state introduces a neat little rotation. Yep, that's all there is to it.

scroll transforms in Framer

Scroll transform effect in Framer.

scroll transforms in Framer

Scroll transform effect in Framer.

scroll transforms in Framer

Scroll transform effect in Framer.

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Join waitlist

Nandi portrait's background
Nandi's portrait

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Join waitlist

Nandi portrait's background
Nandi's portrait

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Join waitlist

Nandi portrait's background
Nandi's portrait

More resources

More resources

View all

  • 3D-rendered early access ticket with gradient blue design

    Floating 3D Ticket in Framer

    Animation

    3D-rendered early access ticket with gradient blue design

    Floating 3D Ticket in Framer

    Animation

    3D-rendered early access ticket with gradient blue design

    Floating 3D Ticket in Framer

    Animation

  • Learn to turn ideas into stunning websites text over 3D logo on dark background

    3D Logo Animation Website in Framer

    Animation

    Learn to turn ideas into stunning websites text over 3D logo on dark background

    3D Logo Animation Website in Framer

    Animation

    Learn to turn ideas into stunning websites text over 3D logo on dark background

    3D Logo Animation Website in Framer

    Animation