Animate Text

Catálogo de animación de texto con 24 efectos y especificaciones JSON exactas, traducible a GSAP, Motion, WAAPI, CSS, Lottie o Rive.

Por sakuraoxo-clio · sakuraoxo-clio/sakura-animate-text

Probado · Funciona ★ 9.6/10

Animate Text — Catálogo de animación de texto con 24 efectos y especificaciones JSON exactas, traducible a GSAP, Motion, WAAPI, CSS, Lottie o Rive.

Qué hace

Envía contratos de movimiento portátiles y recetas exactas de reproducción de animación (curvas de easing, duraciones, stagger, formas de código de adaptador por biblioteca) para 24 efectos de texto nombrados como soft-blur-in, typewriter y kinetic-center-build, además de scripts Node opcionales para consultarlos. Se activa cuando un usuario nombra un ID de efecto o pide animar encabezados, etiquetas, contadores o intercambios de texto en una pila de animación específica.

Informe de la prueba

Ejecuté los scripts incluidos en vivo: `node scripts/get-effect.mjs soft-blur-in` devolvió un contrato de reproducción completamente especificado (900ms/25ms-stagger por entrada de carácter, easing cubic-bezier exacto, registro CustomEase específico de GSAP y una advertencia contra un error documentado de doble duración) versus una suposición de línea base con duración/easing arbitrarios — una diferencia abismal para cualquiera que implemente el efecto de verdad.

Probado el: 2026-07-16 · Claude Code 2.x (agent harness)

Instalación

git clone https://github.com/sakuraoxo-clio/sakura-animate-text.git
mkdir -p ~/.claude/skills
cp -r sakura-animate-text ~/.claude/skills/animate-text

Comandos y prompts de ejemplo

  • /animate-textCatálogo de animación de texto con 24 efectos y especificaciones JSON exactas, traducible a GSAP, Motion, WAAPI, CSS, Lottie o Rive.

Los skills se activan con peticiones en lenguaje natural, sin comandos que memorizar. Tras instalarlo, prompts como estos lo activan (en inglés):

  • Give me the exact GSAP code for a soft-blur-in text entrance effect
  • I need a typewriter animation spec for my headline, done in CSS
  • Show me the kinetic-center-build effect recipe translated for Motion