Typography: 256 animated text effects for Remotion

256 free, MIT-licensed animated text effects for Remotion: reveals, highlights, word swaps, counters, glitches and kinetic type. Install any one with npx shadcn@latest add @remocn/<name>.

Last updated: November 9, 2026

Remocn has 256 free, MIT-licensed text animation components for Remotion: word and letter reveals, highlights, typewriters, word swaps, counters, glitches, kinetic posters and pull quotes. Each one installs with the shadcn CLI and lands in your project as a single TypeScript file, with no runtime dependency besides Remotion.

bash
npx shadcn@latest add @remocn/staggered-fade-up
tsx
import { Composition } from "remotion";
import { StaggeredFadeUp } from "@/components/remocn/staggered-fade-up";
 
const Title = () => <StaggeredFadeUp text="Ship videos faster" staggerDelay={4} />;
 
export const RemotionRoot = () => (
  <Composition id="Title" component={Title} durationInFrames={90} fps={30} width={1280} height={720} />
);

Pick a text effect by job

JobComponentLengthInstall
Word-by-word headlineStaggered Fade Up90fnpx shadcn@latest add @remocn/staggered-fade-up
Letter-by-letter, softSoft Blur In60fnpx shadcn@latest add @remocn/soft-blur-in
Focus pull from blurFocus Blur Resolve90fnpx shadcn@latest add @remocn/focus-blur-resolve
Lines rising from a maskMask Reveal Up90fnpx shadcn@latest add @remocn/mask-reveal-up
Tracking inTracking In90fnpx shadcn@latest add @remocn/tracking-in
One punchy wordSpring Scale In60fnpx shadcn@latest add @remocn/spring-scale-in
Phrase that builds centeredKinetic Center Build60fnpx shadcn@latest add @remocn/kinetic-center-build
Typed textTypewriter120fnpx shadcn@latest add @remocn/typewriter
Handwritten noteHandwrite120fnpx shadcn@latest add @remocn/handwrite
Highlight a phraseMarker Highlight90fnpx shadcn@latest add @remocn/marker-highlight
Recolor one wordInline Highlight90fnpx shadcn@latest add @remocn/inline-highlight
Rotating word after a prefixInline Word Roll75fnpx shadcn@latest add @remocn/inline-word-roll
Swap one phrase for anotherPer-Word Crossfade90fnpx shadcn@latest add @remocn/per-word-crossfade
Correct a claimStrikethrough Replace120fnpx shadcn@latest add @remocn/strikethrough-replace
Count up to a numberRolling Number150fnpx shadcn@latest add @remocn/rolling-number
Decode / scrambleMatrix Decode90fnpx shadcn@latest add @remocn/matrix-decode
GlitchRGB Glitch Text90fnpx shadcn@latest add @remocn/rgb-glitch-text
Looping tickerInfinite Marquee180fnpx shadcn@latest add @remocn/infinite-marquee
Draw the lettersOutline Trace44fnpx shadcn@latest add @remocn/outline-trace
Text on a curvePath Ride70fnpx shadcn@latest add @remocn/path-ride

Length is the frames of motion at 30fps, the minimum for the component's Sequence. For how to animate text by hand, the Remotion pitfalls these components handle and a comparison with other libraries, read Remotion text animations. For subtitles timed to speech, see the 31 caption styles in Captions.

Agents can read this whole section, every component's props and usage included, as one file at /llms-full/typography.txt.

Showing 256 of 256 components

Reveals

Entrances for a headline or a line of copy: by word, by letter, through blur or through a mask. staggered-fade-up is the neutral default; soft-blur-in and focus-blur-resolve read premium.

16

Highlights

Point at one word or phrase inside a sentence that is already on screen. A marker block, a color shift or a passing shine.

3

Dynamic Text

Text that changes while it plays. Typed character by character, or rolled through a reel of values.

2

Tech & Glitch

Scrambles that decode into the text, and RGB-split glitches. Both use Remotion's seeded random(), so every render matches the preview.

2

Text Transitions

Swap one phrase for another with motion. Use them when the layout stays and only the words change.

4

Kinetic

Word-by-word builds with motion and momentum. They suit a hook line that should land one word at a time.

3

Showreel

Heavy display type that snaps, echoes and spins on flat color fields.

5

Vector type

Type built the way a motion designer builds it: trim paths on real glyph outlines, a font editor's points and handles, striped type, text on a path and a repeater.

5

Statements

Finished copy beats for launch and changelog videos: the line, its layout and its motion. Each carries one message, such as a TL;DR, a week recap or a one-line answer. Swap in your words.

64

Headline reveals

Headline-and-subhead entrances with a signature treatment: bokeh, slit-scan, comet trails, photo-filled type. Use one for the title beat of a feature announcement.

51

Kinetic posters

Loud, poster-style type for social cuts and hype beats. Slams, stacks, countdowns and game-UI gags.

25

Word swaps

One word or phrase turns into another in place: anagrams, typo fixes, word ladders, select and replace. Use them to change a claim without cutting the shot.

20

Letter mechanics

Effects that work on the letters themselves. Kerning, weight, case, font and single glyphs move while the word stays readable.

20

Quotes

Big pull quotes with an attribution line. For testimonials and social proof.

5

More

31