/motion-frames
可循环 CSS 动效组合: 旋转环、地球仪、计时器、视差标签
Claude Code
$ npx -y skills add nexu-io/html-anything --skill motion-frames --agent claude-code
Codex
$ npx skills add nexu-io/html-anything --skill motion-frames -a codex -y
Cursor
$ npx skills add nexu-io/html-anything --skill motion-frames -a cursor -y
Gemini CLI
$ npx skills add nexu-io/html-anything --skill motion-frames -a gemini-cli -y
GitHub Copilot
$ npx skills add nexu-io/html-anything --skill motion-frames -a github-copilot -y
OpenCode
$ npx skills add nexu-io/html-anything --skill motion-frames -a opencode -y
Windsurf
$ npx skills add nexu-io/html-anything --skill motion-frames -a windsurf -y
SKILL.md
motion-frames.SKILL.mdname: motion-frames zh_name: "动效英雄帧" en_name: "Motion Frames" emoji: "🌀" description: "可循环 CSS 动效组合: 旋转环、地球仪、计时器、视差标签" category: video scenario: marketing aspect_hint: "桌面 hero" featured: 6 tags: ["motion", "title card", "loop", "video poster"]
【模板: Motion 帧 / Hero Loop】 【意图】一帧带循环动效的 hero, 可作为视频片头或落地页大图。 【布局】
- Rotating type ring (SVG + transform)
- Animated globe / 抽象几何
- Ticking timer (mono 字体, JS 可有可无)
- Parallax labels 浮动
【设计细节】
- 纯 CSS 动效, 流畅可循环
- 电影感调色 + 1 个霓虹 accent
From the team behind Open Design — 40k★ · 200+ contributors, production-grade and iterating faster. html-anything is the focused agent-era HTML editor; if it clicks for you, Open Design is where the same team ships at scale.
Other skills on html-anything.
article-sketchnote-edi…
把一个概念铸成杂志专题档案——真问题→失败→转折→顿悟→命名, 6 个 layout 模具 + 4 字族对比 + 探案档案细节
More skills from other plugins.
prompt-lookup
Activates when the user asks about AI prompts, needs prompt templates, wants to search for prompts, or mentions prompts.chat. Use…
ppt-master
AI-driven presentation workflow for generating editable PPTX decks and slides, reconstructing page visuals, creating reusable…
morph-ppt
Use this skill when the user wants a .pptx with smooth cross-slide animation — PowerPoint Morph transitions, Keynote-style…
frontend-slides
Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to…
Questions about motion-frames.
- Which coding agents can use motion-frames?
- motion-frames installs in Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode and Windsurf with the skills CLI, using each agent's flag shown on this page. Flowy's auto-invocation, which fires a skill when your prompt matches, runs in Claude Code only.

