Beautiful 2D Animations in Framer

View demo

Remix project

Resources

Beautiful 2D Animations in Framer

View demo

Remix project

How can I improve Framer Uni?

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

Share feedback

How can I improve Framer Uni?

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

Share feedback

New

Interaction

Beautiful 2D Animations in Framer

This is a quick demo showing how you can use Hana by Spline to bring smooth 2D animations into your Framer projects. You just set up your animation in Hana, grab the embed, and drop it into Framer. It’s honestly a super easy way to level up your site with interactive visuals. Feel free to remix the project and see how it’s put together!

Created by

Nandi

and

Animated circular text effect with repeating 'HANA' pattern in blue

About the resource

To create this 2D animation, I simply jumped into Hana, and found a cool demo project by Ranieri that I could use for my Framer project.

I created an embed link in Hana, and used Framer’s embed component to integrate it into the hero section. Super simple process.

About the resource

To create this 2D animation, I simply jumped into Hana, and found a cool demo project by Ranieri that I could use for my Framer project.

I created an embed link in Hana, and used Framer’s embed component to integrate it into the hero section. Super simple process.

About the resource

To create this 2D animation, I simply jumped into Hana, and found a cool demo project by Ranieri that I could use for my Framer project.

I created an embed link in Hana, and used Framer’s embed component to integrate it into the hero section. Super simple process.

Design interface showing embedded animated circular text pattern in 2D animation project — The embed component in Framer.

I also recorded the full process, so if you want to learn how to use Hana for taking your Framer sites to the next level, make sure to watch this video.

If you’re looking for the Hana project file for this animation, get it here.

I also recorded the full process, so if you want to learn how to use Hana for taking your Framer sites to the next level, make sure to watch this video.

If you’re looking for the Hana project file for this animation, get it here.

I also recorded the full process, so if you want to learn how to use Hana for taking your Framer sites to the next level, make sure to watch this video.

If you’re looking for the Hana project file for this animation, get it here.

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

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

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

More resources

View all

Fluid Notification Animation in Framer
Interaction
Fluid Notification Animation in Framer
Interaction
Fluid Notification Animation in Framer
Interaction
Expanding Tooltip Animation in Framer
Interaction
Expanding Tooltip Animation in Framer
Interaction
Expanding Tooltip Animation in Framer
Interaction