Explore SplitFX's powerful features that make creating text animations effortless
Demo ProjectsThree different splitting modes to choose from: chars, words, or lines.
Animate HTML elements' text in and out on scroll, window load, hover, or click.
Full control over animation timing, stagger, stagger direction, and easing.
Choose from a variety of ready-to-use animations.
Build and use your own animations to create custom text effects tailored to your needs.
Built specifically for text animations with zero external dependencies.
A set of convenience methods that make SplitFX easier to use.
Works on the text you already have in your HTML, so search engines can read it.
Split and animate the text of HTML elements even when they contain nested elements.
Explore demos, read the docs, or try the studio to get the most out of SplitFX.
Find answers to common questions, questions you may have, and helpful tips about SplitFX.
Use SplitFX whenever you want to add engaging text animations to your website, such as headings, hero titles, call-to-actions, or section labels, without relying on heavy animation libraries.
Yes.
SplitFX works on the text already present in your HTML, so search engines and assistive technologies can read it.
Yes.
You can use convenience methods that make SplitFX easier to use, or core methods when you need more control over your custom logic.
No.
SplitFX is dependency-free and works with plain JavaScript.
Yes.
SplitFX allows you to split and animate the text of HTML elements even when they contain nested elements.
Yes.
You can apply multiple convenience methods as long as you use the same SplitFX instance.
Yes.
You can replay animations using Core Methods or configure convenience methods depending on your use case.
SplitFX converts spaces and line breaks into split elements.
If your HTML contains unnecessary whitespace, it may appear as unwanted gaps.
To avoid this, see the Preventing Unwanted Spaces section of the documentation.
Yes.
But it's best used on headings and short paragraphs.
