Get "PHP 8 in a Nuthshell" (Soon includes PHP 8.4)
Amit Merchant

Amit Merchant

A blog on PHP, JavaScript, and more

Twitching Text

I recently stumbled upon this sleek portfolio website of Maxime Heckel. It’s clean and minimalistic and there are a lot of small details and micro-interactions that make it stand out.

But one thing that intrigued me was this twitching text effect which looks quite natural and subtle at the same time.

Twitching Text

I dug into this effect and tried to recreate it.

Here’s the CodePen that I ended up with for the same.

See the Pen Animated gradient effect using CSS by Amit Merchant (@amit_merchant) on CodePen.

The entire piece uses a lot of keyframe animations. If you notice, it also uses the data-text attribute to use it as content and animate it further to a realistic looking twitching effect.

Like this article?

Buy me a coffee

👋 Hi there! I'm Amit. I write articles about all things web development. You can become a sponsor on my blog to help me continue my writing journey and get your brand in front of thousands of eyes.

Comments?