Some On-Scroll Text Highlight Animations

Some ideas for scroll-based text highlight animations.

Today I’d love to share some text highlight effects that have been whirling in my mind for a while. They are inspired by some details I saw in Dribbble shots and some other videos. The idea is to highlight text, particularly words, on scroll, when they come into the reader’s view.

Here are the designs that this is based on:

So here are just a couple of ideas, hope you enjoy them and find them useful!

Some of the effects can take more than one word, but most of them are optimized for one word only.

One of the effects is achieved using GSAP Flip, which facilitated moving a big title into a block of text!

Thanks for checking by and don’t forget to take a look at more typography and scroll-based demos!

Tagged with:

Manoela Ilic

Manoela is the main tinkerer at Codrops. With a background in coding and passion for all things design, she creates web experiments and keeps frontend professionals informed about the latest trends.



Source link

Welcome Back!

Login to your account below

Retrieve your password

Please enter your username or email address to reset your password.

Add New Playlist

Are you sure want to unlock this post?
Unlock left : 0
Are you sure want to cancel subscription?