It is a Remotion package to animate the text. It animates the text either by charecters or by words on top of multiple css properties. It follows same pattern of interpolate function by native Remotion.
npm i remotion-animate-text
import { AnimatedText } from "remotion-animate-text";
import { AbsoluteFill } from "remotion";
export const Example: React.FC = () => {
const animation = {
delimiter: "",
opacity: [0, 1],
x: [1, 0],
y: [1, 0],
scale: [0, 1],
rotate: [45, 0],
hideLoading: false,
refRange: [0, 100], // can be any length and all other properties should also be of same length
durations: [40, 50] // using this you can control for how long each part should animate in frames
};
return (
<AbsoluteFill>
<AnimatedText duration={60} animation={animation}>
Hello world
</AnimatedText>
</AbsoluteFill>
);
};See the LICENSE.md file for the license of this repo.
To use Remotion, a company license is needed for some entities. Read the terms here.