Star Wars Intro - Scrolling Text Tutorial (CSS Animation)

The opening to Star Wars is iconic. The effect of text scrolling both up and away from the screen was both a crazy cool special effect for a movie back in 1977 and a cool typographical style that was brand new at the time.

Hey gang, in this CSS animation tutorial we'll create a scrolling block of text that fades into the distances, just like the Star Wars movies.

We can achieve a similar effect with HTML and CSS! This post is more about how to get that sliding text effect rather than trying to re-create the full Star Wars opening sequence or matching the exact styles used in the movie, so let’s get to a place where this is the final result