Star Wars Prologue Text Effect in Framer

Star Wars Prologue Text Effect in Framer

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

New

New

New

Website

Star Wars Prologue Text Effect in Framer

This is a Star Wars text crawl effect recreated in Framer without writing any code, in collaboration with Fons Mans. You can use this template for an unorthodox about page to impress your visitors with your uniqueness.

image of Nandi Muzsik
profile image of Fons Mans

Created by

About section with 3D spherical text describing designer's background
About section with 3D spherical text describing designer's background
About section with 3D spherical text describing designer's background

About the resource

I got a message from Fons the other day asking for some help recreating the famous text crawl effect from the Star Wars movies, so I quickly put together a demo for him showing how the effect can be created entirely natively in Framer, without any coding.

About the resource

I got a message from Fons the other day asking for some help recreating the famous text crawl effect from the Star Wars movies, so I quickly put together a demo for him showing how the effect can be created entirely natively in Framer, without any coding.

About the resource

I got a message from Fons the other day asking for some help recreating the famous text crawl effect from the Star Wars movies, so I quickly put together a demo for him showing how the effect can be created entirely natively in Framer, without any coding.

Designer portfolio with animated text and pyramid animation controls

The three variants of the text component.

Designer portfolio with animated text and pyramid animation controls

The three variants of the text component.

Designer portfolio with animated text and pyramid animation controls

The three variants of the text component.

As you can see in the image above, to achieve this text effect, I just had to create a component with three variants, in which I have the text in a 3D transformed position. As I connect the variants with appear interactions, the text smoothly scrolls from beginning to end, and then finally disappears.

I sent the demo over to Fons, he did some AI & design magic to make it look sexy, and we published this little template for y'all to play around with.

Enjoy!

As you can see in the image above, to achieve this text effect, I just had to create a component with three variants, in which I have the text in a 3D transformed position. As I connect the variants with appear interactions, the text smoothly scrolls from beginning to end, and then finally disappears.

I sent the demo over to Fons, he did some AI & design magic to make it look sexy, and we published this little template for y'all to play around with.

Enjoy!

As you can see in the image above, to achieve this text effect, I just had to create a component with three variants, in which I have the text in a 3D transformed position. As I connect the variants with appear interactions, the text smoothly scrolls from beginning to end, and then finally disappears.

I sent the demo over to Fons, he did some AI & design magic to make it look sexy, and we published this little template for y'all to play around with.

Enjoy!

Framer Navigator

Learn the fundamentals of Framer for free.

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

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.

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.

Nandi portrait's background
Nandi's portrait

More resources

More resources

  • Futuristic learning platform with sci-fi cityscape and waitlist signup

    AI No-Code Hero Section in Framer

    Website

    Futuristic learning platform with sci-fi cityscape and waitlist signup

    AI No-Code Hero Section in Framer

    Website

    Futuristic learning platform with sci-fi cityscape and waitlist signup

    AI No-Code Hero Section in Framer

    Website

  • Framer website builder interface showcasing Canvas design tool

    Framer Website Recreation in Framer

    Website

    Framer website builder interface showcasing Canvas design tool

    Framer Website Recreation in Framer

    Website

    Framer website builder interface showcasing Canvas design tool

    Framer Website Recreation in Framer

    Website