Agent Skills › nexu-io/motion-anything › fx-typewriter-multi

fx-typewriter-multi

GitHub

提供多行打字机特效，用于幻灯片或发布视频的标题和章节过渡。基于Canvas实现，支持减少动态偏好设置保护，需克制使用以避免影响阅读专注度。

recipes/slides/fx-typewriter-multi/SKILL.md nexu-io/motion-anything

Trigger Scenarios

需要为幻灯片添加多行打字机动画效果制作视频发布的视觉特效

Install

npx skills add nexu-io/motion-anything --skill fx-typewriter-multi -g -y

More Options

Non-standard path

npx skills add https://github.com/nexu-io/motion-anything/tree/main/recipes/slides/fx-typewriter-multi -g -y

Use without installing

npx skills use nexu-io/motion-anything@fx-typewriter-multi

指定 Agent (Claude Code)

npx skills add nexu-io/motion-anything --skill fx-typewriter-multi -a claude-code -g -y

安装 repo 全部 skill

npx skills add nexu-io/motion-anything --all -g -y

预览 repo 内 skill

npx skills add nexu-io/motion-anything --list

SKILL.md

Frontmatter

{
    "od": {
        "mode": "prototype",
        "preview": {
            "type": "html"
        },
        "surface": "web",
        "category": "animation-motion",
        "platform": "desktop",
        "upstream": "https:\/\/github.com\/nexu-io\/open-design",
        "design_system": {
            "requires": false
        },
        "example_prompt": "Use fx-typewriter-multi as a text effect on a slide or hero: call HPX['typewriter-multi'](el) on a positioned dark\ncontainer; keep to one bold effect per screen, with a reduced-motion guard."
    },
    "name": "fx-typewriter-multi",
    "triggers": [
        "text",
        "多行打字机"
    ],
    "description": "Multi-line typewriter — types lines in sequence. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch\nvideos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.\n"
}

Typewriter Multi

Multi-line typewriter — types lines in sequence. From Open Design's html-ppt fx pack (Apache-2.0). Part of motion-anything; obeys MOTION-SPEC.md.

When to use it

Title cards, section breaks, or hero moments in slides / launch videos.

When NOT to use it (restraint)

Web body content or anything needing focused reading. Never more than one bold effect at once.

How to apply

Copy typewriter-multi.js and _util.js and link them.
Add data-fx="typewriter-multi" to a positioned container; call HPX['typewriter-multi'](el) (guard prefers-reduced-motion).