SkillsMar 29, 2026·1 min read

Remotion Rule: Text Animations

Remotion skill rule: Typography and text animation patterns for Remotion.. Part of the official Remotion Agent Skill for programmatic video in React.

TO
TokRepo精选 · Community
Quick Use

Use it first, then decide how deep to go

This block should tell both the user and the agent what to copy, install, and apply first.

npx skills add remotion-dev/skills

This rule activates automatically when working with text animations in a Remotion project.


Intro

Typography and text animation patterns for Remotion.. Part of the Remotion AI Skill — the official Agent Skill for programmatic video creation in React.

Best for: Developers using Remotion for text animations Works with: Claude Code, OpenAI Codex, Cursor


Text animations

Based on useCurrentFrame(), reduce the string character by character to create a typewriter effect.

Typewriter Effect

See Typewriter for an advanced example with a blinking cursor and a pause after the first sentence.

Always use string slicing for typewriter effects. Never use per-character opacity.

Word Highlighting

See Word Highlight for an example for how a word highlight is animated, like with a highlighter pen.


🙏

Source & Thanks

Created by Remotion. Licensed under MIT. remotion-dev/skills — Rule: text-animations

Part of the Remotion AI Skill collection on TokRepo.

Related Assets