Shuffling Typography Animation

A shuffling type animation with various effects for a geeky terminal look.

By in Playground on
Demo Code

The other day, I stumbled upon a captivating type animation created by Andreas Gysin. I was immediately inspired and decided to experiment with similar effects. You can witness the brilliance of Andreas’ animation on his project site LCD 1 and also on his website.

This totally geeky effect looks like some terminal application come to life and my aim was to try out different little modifications to the animation, creating different patterns and using colors.

The terminal-based design of the demo

Here’s a video if all the different types of effects:

I hope you enjoy the set and can find a use for this somewhere in your projects 🙂

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.

On-Scroll Shape Morph Animations

Creating the Effect of Transparent Glass and Plastic in Three.js

Push Animation on Grid Items

Stay in the loop: Get your dose of frontend twice a week

Fresh news, inspo, code demos, and UI animations—zero fluff, all quality. Make your Mondays and Thursdays creative!