Resources

Bubble Up Elements in Framer

View demo

Copy component

Remix project

Copy component

Remix project

Resources

Bubble Up Elements in Framer

View demo

Copy component

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

Component

Bubble Up Elements in Framer

This is a bubble up element component for Framer that makes images or emojis float upwards. Customize type, animation mode, speed, amount, and size for playful visuals. Feel free to remix or simply copy the component to your project.

image of Nandi Muzsik
image of Prianca S.

Created by

Nandi

and

All done confirmation screen with animated blue smiley bubbles
All done confirmation screen with animated blue smiley bubbles
All done confirmation screen with animated blue smiley bubbles

About the resource

To use the bubble up element component, choose between images or emojis as the element type. Set the animation mode to loop or once, adjust the speed from 1 to 100, and pick the number of elements from 2 to 24. You can also control the size of each element for the perfect visual effect.

About the resource

To use the bubble up element component, choose between images or emojis as the element type. Set the animation mode to loop or once, adjust the speed from 1 to 100, and pick the number of elements from 2 to 24. You can also control the size of each element for the perfect visual effect.

About the resource

To use the bubble up element component, choose between images or emojis as the element type. Set the animation mode to loop or once, adjust the speed from 1 to 100, and pick the number of elements from 2 to 24. You can also control the size of each element for the perfect visual effect.

Bubble Up component settings with emoji animation controls

The bubble up component properties in Framer.

Bubble Up component settings with emoji animation controls

The bubble up component properties in Framer.

Bubble Up component settings with emoji animation controls

The bubble up component properties 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

  • Minimal black screen with Framer logo and scroll text

    Animate Path on Scroll in Framer

    Component

    Minimal black screen with Framer logo and scroll text

    Animate Path on Scroll in Framer

    Component

    Minimal black screen with Framer logo and scroll text

    Animate Path on Scroll in Framer

    Component

  • Interactive text scramble hover effect demo

    Text Area Scramble for Framer

    Component

    Interactive text scramble hover effect demo

    Text Area Scramble for Framer

    Component

    Interactive text scramble hover effect demo

    Text Area Scramble for Framer

    Component