Resources

Warp Background Component in Framer

View demo

Copy component

Remix project

Copy component

Remix project

Resources

Warp Background Component 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

How to make your first $1,000 with Framer

Free training

How to make your first $1,000 with Framer

Free training

Component

Warp Background Component in Framer

This is an animated warp background component for Framer, ported from the 21st.dev website. Feel free to copy and paste it into your projects to play around with and add that “wow” effect to your websites and Framer templates.

image of Nandi Muzsik
profile image of Emanuele
profile image of Dillion Verma

Created by

Nandi

,

Emanuele

,

and

Dillion

moving colorful lines with high perspective distortion

About the resource

This is a fully customizable Framer component that you can simply just copy and paste into your Framer projects and start playing around with the properties on the right. I highly recommend using it with absolute positioning, maybe placing it in the background of your hero sections or cards (but feel free to go wild with this).

About the resource

This is a fully customizable Framer component that you can simply just copy and paste into your Framer projects and start playing around with the properties on the right. I highly recommend using it with absolute positioning, maybe placing it in the background of your hero sections or cards (but feel free to go wild with this).

About the resource

This is a fully customizable Framer component that you can simply just copy and paste into your Framer projects and start playing around with the properties on the right. I highly recommend using it with absolute positioning, maybe placing it in the background of your hero sections or cards (but feel free to go wild with this).

properties panel of a Framer component

The component properties of the Warp Background component.

properties panel of a Framer component

The component properties of the Warp Background component.

properties panel of a Framer component

The component properties of the Warp Background component.

As you can see it above, there are quite a few properties you can tweak to make sure the component really fits your brand and the vibe you’re going for.

As you can see it above, there are quite a few properties you can tweak to make sure the component really fits your brand and the vibe you’re going for.

As you can see it above, there are quite a few properties you can tweak to make sure the component really fits your brand and the vibe you’re going for.

Learn to make your first $1,000 with Framer from zero.

From no followers, no portfolio, no reputation, to making thousands with a profitable Framer business.

Free training

Nandi portrait's background

Learn to make your first $1,000 with Framer from zero.

From no followers, no portfolio, no reputation, to making thousands with a profitable Framer business.

Free training

Nandi portrait's background

Learn to make your first $1,000 with Framer from zero.

From no followers, no portfolio, no reputation, to making thousands with a profitable Framer business.

Free training

Nandi portrait's background

More resources

More resources

View all

  • Music app playlist created screen with artist avatars

    Playlist Generation Circular Animation in Framer

    Component

    Music app playlist created screen with artist avatars

    Playlist Generation Circular Animation in Framer

    Component

  • Customer testimonials section with review letter card

    3D Letter Testimonials in Framer

    Component

    Customer testimonials section with review letter card

    3D Letter Testimonials in Framer

    Component