Text Animations Collection (animate-text)
A hand-crafted catalog of 24 named, deterministic text-animation specs wrapped as an installable AI-agent skill — library-agnostic motion contracts (exact pacing, easing curves, stagger) plus per-library recipes, so agent output looks right on the first prompt.
By Pixel Point (Alex Barashkov, @alex_barashkov). Repo: pixel-point/animate-text (123 stars, 9 forks; site pixelpoint.io/skills/animate-text). Launch: 3,883 bookmarks, 2,423 likes. Source: X/@alex_barashkov, 2026-04-23 · Source: GitHub pixel-point/animate-text, checked 2026-07-02
What it is
animate-text narrows a notoriously unstable part of agent output — text motion — into explicit, reviewable fields: entrance timing, easing, character/word stagger, hold duration, and exit. Each effect is a portable contract (e.g. typewriter = 240ms / 46ms stagger / steps(1, end)) plus implementation recipes for specific libraries, so the same intent renders consistently whether you target GSAP, Motion (motion.dev), WAAPI, Anime.js, or Remotion. Source: openagentskills.dev animate-text review, 2026-06-12 · Source: GitHub heygen-com/hyperframes text-effects.md, 2026-06-12
npx skills add pixel-point/animate-text --skill animate-text
# then, in your agent:
# /animate-text apply soft-blur-in to hero section text
The catalog is the source of truth (catalog/text-animations/); the installable skill and the website are generated from it. Source: GitHub pixel-point/animate-text, 2026-06-12
Artifact and source snapshot
The reviewed launch video is a product-demo grid: a left rail shows the npx skills add pixel-point/animate-text install command while six white preview panes cycle through named text effects such as "Motion with intent," "Pop into place," "Quiet motion," "Words push left," and "Focus resolves clearly." The durable value is the repeatable motion vocabulary plus installable skill packaging, not a one-off visual treatment. Source: local video artifact review, 2026-07-02
As of 2026-07-02, the public GitHub repo is on main at 0f783e459d62d851b7e5308e0596fa5fbac00c7e, with no public tags returned by git ls-remote --tags and no declared GitHub license. Treat it as a reference skill/source package until the repo publishes explicit release tags or package metadata. Source: GitHub API and git ls-remote, 2026-07-02
Effect catalog (selected)
| Family | Examples |
|---|---|
| Per-character | soft-blur-in, typewriter, stagger-from-center |
| Per-word | kinetic-center-build, short-slide-right, short-slide-down, depth-parallax-words |
| Mask / line | line-by-line-slide, mask-up reveals |
| Transitions | shimmer-sweep, fade-through, shared-axis, blur-resolve |
Source: GitHub heygen-com/hyperframes text-effects.md, 2026-06-12
Anime.js ScrambleText
Anime.js now has a first-party scrambleText() helper for character-by-character scramble/reveal effects. It can control reveal direction, cursor behavior, perturbation, timing, and keyframe/timeline composition, then drive innerHTML like any other Anime.js animated property. Source: Anime.js ScrambleText docs, checked 2026-07-02
Use this as the implementation route when the desired effect is terminal text, randomized copy reveal, cursor-led decoding, or direction-aware text transition inside an Anime.js project. The reviewed demo video shows the docs/control-panel shape directly: dark Anime.js docs, CodePen/browser framing, reveal-direction controls, cursor controls, perturbation, and scrambled characters resolving across the page. Source: X/@JulianGarnier, 2026-04-29; Source: local video artifact review, 2026-07-02
How it fits
This is the spec layer, not a renderer — it pairs with whatever produces frames. HyperFrames explicitly defers to animate-text for deterministic text specs instead of reinventing easing values, a clean skills-compose-skills pattern. It slots between full Frontier Stack 2026 GSAP/Motion orchestration (overkill for a hero reveal) and raw CSS keyframes (too limited for staggered character motion), and complements the vocabulary layer in Animation Vocabulary (Animations.dev) (naming the pattern) by supplying the exact numbers. For vector output use Text-to-Lottie; for prebuilt component motion see Frontend and Design Skills. Source: compiled from GitHub + X, 2026-06-12
Best fit: video titles/captions/intros, landing-page hero text, portfolio micro-interactions. Weaker fit: full layout choreography or complex scene transitions. Demo video on the launch tweet. Source: openagentskills.dev, 2026-06-12
Timeline
- 2026-04-23 | @alex_barashkov (Pixel Point) ships
animate-text: "a hand-crafted collection of text animations wrapped as a SKILL for your AI agent. Use it with Remotion, Motion, GSAP, WAAPI… clear animation specs — pacing, curves, transitions." 3,883 bookmarks, 2,423 likes; demo video. Source: X/@alex_barashkov, 2026-04-23 - 2026-06-12 | Deep enrichment: identified repo
pixel-point/animate-text, install/usage commands, 24-effect deterministic-spec model, per-library recipes (GSAP/Motion/WAAPI/Anime.js), and the HyperFrames deferral. Source: GitHub pixel-point/animate-text, 2026-06-12 - 2026-07-02 | Added Anime.js
scrambleText()as the first-party implementation route for scramble/reveal text inside Anime.js projects after reviewing the launch bookmark, local demo media, official docs, npm, and GitHub source state. Source: raw/x-bookmarks/enriched/2049545870811467906.json; Anime.js docs, 2026-07-02 - 2026-07-02 | Reviewed the original Pixel Point launch artifact and refreshed the repo snapshot: 123 stars, 9 forks, no public tags,
mainat0f783e459d62d851b7e5308e0596fa5fbac00c7e. Source: raw/x-bookmarks/enriched/2047309188569666010.json; local media artifact; GitHub, 2026-07-02