title-kinetic-typography
Provider-independent title design and kinetic typography direction for video, animation, ads, explainers, social hooks, brand films, lyric/text videos, title cards, main titles, lower thirds, captions-as-design, and other motion-led text. Use when an agent must plan, prompt, implement, hand off, iterate, or QA typography hierarchy, readability, timing, reveal/hold/exit, motion semantics, line breaks, safe areas, localization, brand constraints, accessibility, flashing/motion safety, or production specs for animated text.
Profile →npx skills add calesthio/generative-media-skills --skill title-kinetic-typography --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
What it does
Directs an agent to treat text elements as designed scenes, not overlays, requiring planning, prompting, implementation, handoff, iteration, and QA for typography hierarchy, timing, motion, safe areas, localization, accessibility, and production specs.
How it works
- Classifies text elements into roles (main title, title card, lower third, caption-as-design, lyric/text video, social hook, CTA/legal).
- Requires writing a one-line job per element (e.g., hook the first two seconds; identify speaker without covering hands/face; make chorus feel like a collective chant while keeping readability; reveal product claim and proof in the same gaze path).
- Builds a typographic hierarchy with primary/secondary/tertiary/ambient layers and uses specific contrast axes (size, weight, case, width, color/value, position).
- Enforces readability rules for motion text, considering device, aspect ratio, background, platform overlays, and whether captions exist; includes guardrails like backing, shadow, or dimming when backgrounds change.
- Governs line breaks and multilingual handling with meaning/layout locks for translations; ensures line breaks reflect semantic chunks and script-specific rules.
- Specifies timing: reveal/hold/exit for each text beat, with guidance on platform-specific timing and attention-driven pacing.
- Defines motion semantics vocabulary (rise, drop, slide, scale, blur, wipe, type-on, etc.) and recommends using motion to clarify relationships or states.
- Emphasizes safe areas and platform variants with verified modern guidelines for TikTok, Google/YouTube, and Meta; recommends platform-specific exports and central content for cross-format consistency.
- Enforces brand constraints and accessibility checks (contrast, motion sensitivity, flashing limits, captions, dyslexia considerations).
- Provides prompting and specification guidance for generative tools: state typography as art direction with fidelity constraints, include exact text/variations, language, type personality, hierarchy, layout, and timing.
When to use it
Use when the agent must plan, prompt, implement, hand off, iterate, or QA typography hierarchy, readability, timing, reveal/hold/exit, motion semantics, line breaks, safe areas, localization, brand constraints, accessibility, flashing/motion safety, or production specs for animated text.
What it can touch
- Tools: claude-code, codex, copilot, cursor (as declared).
- Includes exact textual directions, typography roles, layout constraints, timing budgets, and accessibility checks.
Caveats
- Documented safety and platform guidelines are up-to-date as of verification dates (2026-07-10) for safe areas and ad placements.
- Multilingual and script-specific line-breaking rules require locale-aware handling; meaning/layout locks may be invoked for translations.
- Do not animate critical legal or disclosure text faster than readability allows; ensure safe-area constraints across formats.
# Title and kinetic typography direction Use this skill to make text behave like a designed scene, not a decorative overlay. Treat every text element as a timed editorial decision with a job: identify, explain, sell, signal emotion, guide attention, or make speech readable. This is provider-independent. It applies whether the final asset is built in After Effects, HTML/CSS/GSAP, Remotion, Lottie,
What does the title-kinetic-typography skill do?
Provider-independent title design and kinetic typography direction for video, animation, ads, explainers, social hooks, brand films, lyric/text videos, title cards, main titles, lower thirds, captions-as-design, and other motion-led text. Use when an agent must plan, prompt, implement, hand off, iterate, or QA typography hierarchy, readability, timing, reveal/hold/exit, motion semantics, line breaks, safe areas, localization, brand constraints, accessibility, flashing/motion safety, or production specs for animated text.
How do I install it?
Run `npx skills add calesthio/generative-media-skills --skill title-kinetic-typography --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From calesthio/generative-media-skills, a repository with 112 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.