Movinwords

I’m excited to introduce Movinwords, a plugin I created to help you animate words and letters on your website or webapp with minimal impact on performance. It’s simple, lightweight (3.2kb gizipped), and completely free of any dependencies, so you can easily add text animations without worrying about bloat.

If you've ever wanted to animate your text but didn't want the heavy overhead of something like GSAP, Movinwords is the perfect alternative. It gives you full control over both word-level and letter-level animations, making it incredibly flexible for all kinds of projects. Whether it’s Vue, React, or Nuxt, this plugin works seamlessly across the board.

But that’s not all! Movinwords comes with a bunch of helpful features. You can manage the plugin’s lifecycle with events, highlight specific parts of your sentences, and control when animations should trigger with viewport intersection. This means your animations only fire when the text actually enters the viewport, saving resources and keeping things smooth. Plus, there’s a lot more under the hood that you can explore as you get into it.

To make it even easier to get started, I’ve built this playground where you can experiment with Movinwords and see how it behaves. You can tweak the settings, test different animations, and find the best setup for your needs before implementing it on your project (and also get the code). I’ve made sure it’s super easy to jump in and play around with!

In a nutshell, Movinwords is perfect for anyone who wants to add slick text animations without the complexity of other libraries. And because it’s lightweight, it won’t slow down your site.

If you're looking for an easy-to-use solution for animating text in your project, I highly recommend giving Movinwords a try.
Again, you can check out the Playground, mess around with it, and see exactly how it fits into your next (or Nuxt, Vue, React, Svelte, Angular, vanilla) project.