尧图网站建设 
AI 应用人工智能AI AgentAI 写作媒体生成【免费下载链接】html-anything✨ The agentic HTML editor — your local AI agent writes the HTML, you ship it. 75 Skills × 9 Surfaces (magazine · deck · poster · XHS / tweet · prototype · data report · Hyperframes) ️ Sandboxed preview · 1-click to WeChat / X / Zhihu / HTML / PNG Zero API key — Claude Code / Cursor / Codex / Gemini / Copilot / OpenCode / Qwen / Aider.项目地址https://gitcode.com/gh_mirrors/ht/html-anything点击查看免费下载导读本文以 html-anything 仓库中 vfx-text-cursor 技能模板 为核心拆解一个面向「视频开场 / Hero 帧」的 AI 生成模板的完整设计从 SKILL.md 的 frontmatter 与指令正文到同目录example.md/example.html的配套示例再到它在模板注册表、预览与转换 API 中的落盘加载链路。读完你可以掌握这类打字光标 chromatic 拖光动效模板的参数语义、设计红线与实现方式以及给 html-anything 新增一个同类技能模板需要准备的完整文件结构。前置说明SKILL.md 是一份给 AI Agent 的自然语言指令模板正文它不直接描述项目代码而是约束当用户选中此模板时Agent 应该如何生成 HTML。因此本文的源码级证据主要取自模板加载器 loader.ts、提示词组装器 shared.ts 与转换 API route.ts以说明这份指令如何被读取、如何与全局设计准则拼接、最终如何流式返回给前端。一、模板是什么一张 SKILL.md 的完整骨架html-anything 采用一技能一目录的磁盘注册表结构。每个模板是一个目录src/lib/templates/skills/id/ SKILL.md # frontmatterid、scenario、tags… prompt 正文 example.md # 可选示例输入内容 example.html # 可选预渲染预览picker 内联展示见 loader.ts 的目录常量与注释。vfx-text-cursor 正是这种结构下的一个完整案例SKILL.md 负责告诉 Agent 怎么画example.md 提供一段可复用的金句输入example.html 是这套指令的标准答案——两者共同构成example_id: sample-vfx-text-cursor的示例组。新增模板 新建一个文件夹无需改动 TS 代码。API 路由会重新扫描磁盘客户端重新拉取/api/templates即可见 loader.ts。1.1 frontmatter让模板可被发现、可被分类vfx-text-cursor 的 frontmatter 完整列出字段值含义name/zh_name/en_namevfx-text-cursor/ VFX 文字光标 / VFX Text Cursor模板 ID 与双语展示名emoji✨picker 图标description光标拖光 彩色像散射线 定向光斑, 适合视频片头逐字揭示金句一句话介绍category/scenariovideo/video分类与场景键对应 picker 筛选 chipaspect_hint1920×1080 (16:9)画布尺寸提示会拼进 diff-edit 提示词featured/recommended38 / 7排序权重recommended越小越靠前见 loader.tstags[vfx,text,cursor,chromatic,reveal,frame]检索标签example_id等sample-vfx-text-cursor示例元数据仅当存在 example.md/html 时生效loader.tsloader 用零依赖的正则解析这套扁平 frontmatterloader.ts支持字符串可带引号、整数与一行数组字面量——tags: [...]会被拆成数组featured/recommended会Number()转换。scenario: video落在 scenarios.ts 的SCENARIO_KEYS白名单里因此 picker 能用 i18n 的template.scenario.video显示中文标签不在白名单的 scenario 则归入末尾的 other 桶、以原始 key 显示scenarios.ts。二、SKILL.md 正文一份可执行的分镜脚本SKILL.md 去掉 frontmatter 后的正文body就是 Agent 生成 HTML 的模板级指令被 assemblePrompt 夹在全局设计准则与用户内容之间整体构成最终提示词。其结构可拆为四层2.1 意图与画布分镜的场正文开篇明确这是视频开场 / Hero 帧——光标在画布上打字文字逐字浮现后面拖着彩色像散尾迹 定向光斑。画布固定1920×1080背景用#06070a暗哑黑或#0a0d12暖偏蓝并加微妙 vignette暗角。这正是 example.html 里.vignette的实现radial-gradient(circle at center, transparent 50%, rgba(0,0,0,0.8) 100%)配合mix-blend-mode: overlay的 SVGfeTurbulence噪点层.grainopacity 0.06给纯黑底增加质感——这两个层在 example 里以绝对定位覆盖全屏z-index 1~2文字层 z-index 10 保持在前。2.2 内容与排版金句的镜指令给出具体排版规格金句一行或多行居中字号6-8vwexample 用clamp(48px,7vw,108px)weight 700example 用font-black即 900字体Inter Tight/Source Sans 3/Noto Sans SCexample 实际引入 Inter Tight 400/700/800/900 Noto Sans SC 400/700/900逐字揭示每个字符 80ms 间隔当前字符后跟▍光标example 用 CSS 方块光标.cursor18px 宽、height:1.05emblink 1s steps(1) infinite即 1.0s 周期步进闪烁已揭示文字默认白色#f5f5f7即将揭示位置加chromatic ghosttext-shadow: 2px 0 #ff3b6f, -2px 0 #00d4ff在 reveal 瞬间出现、200ms 内收敛回正常光标颜色 accenthot pink#ff3b6f/ cyan#00d4ff/ amber#ffb547三选一后面拖 60-120px 的 motion blur trail径向渐变到透明。example.html 印证了这三条.cursor的box-shadow: 0 0 24px #ff3b6f, 0 0 8px #ff3b6f, 60px 0 80px rgba(255,59,111,0.6)—— 前两层是发光第三层60px 0 80px正是光标右侧拖一条约 60px 的辉光尾迹.chroma类则实现3px 0 #00d4ff / -3px 0 #ff3b6f的二元像散与 40px 的 pink 外发光。注意text-shadow同时压 cyan 在右、hot pink 在左与 frontmatter 的示例 tagline「HOT PINK × CYAN CHROMATIC」完全一致。2.3 光斑与射线氛围层打字位置附近随机生成 3-5 道定向光斑light leak细长矩形linear-gradient(45deg, transparent, accent20, transparent)mix-blend-mode: screen不规则角度。example 落地为三条.ray.ray-1hot pink 60% 宽 /.ray-2cyan 50% 宽 /.ray-3amber 40% 宽各自rotate(-12deg / 15deg / -8deg)并加 5-8px blurz-index 1 压在文字下方——这正是截图里淡粉、淡蓝光线的来源。文字全部打完后再加 0.5sshimmer sweep光带横扫全段。2.4 字段区帧内信息帧内四角信息是开场帧的可信度来源顶部 captionFRAME 01 · OPENINGuppercase、letterspace 0.18em、11px、opacity 0.5文字下方副标24-28px、opacity 0.6来源 / 章节example 为 — Claude Code 团队, 2026右下角 timecode00:03:21mono 字体example 用 JetBrains Mono且右上角补了VFX · TEXT CURSOR、底部 footer 补了HTML-ANYTHING · VFX-TEXT-CURSOR与REC ●增强摄像机取景框的氛围。2.5 设计红线负向约束指令以「绝不」开头的硬约束是这类模板质量的关键禁止多色彩虹 chromatic只用 hot pink cyan 二元像散不做 R/G/B 全色字体白名单西文Inter TightBold、中文Noto Sans SCBold严禁衬线动效keyframes JSsetTimeout逐字且必须可被prefers-reduced-motion关闭直接显示全部文字——这是无障碍硬性要求内容真实性必须用用户提供的金句不捏造与全局设计准则的内容真实性一节呼应单文件除字体外不外链资源。这些约束会直接进入最终提示词与 shared.ts 的全局准则合并。全局准则还额外要求禁止文件系统工具纯 stdout 流式输出 HTML不以 markdown 围栏包裹等保证 Agent 的产出能被前端直接捕获。三、配套示例example.md 与 example.html 的配对关系模板自带示例是一个输入→输出对example.md极简的 Markdown 输入只有金句Markdown 是给作者的中间过程, HTML 才是给读者的最终形态、章节标记FRAME 01 · OPENING与 Timecode00:03:21三个字段example.html上述三个字段的标准渲染——金句成为 h1 主体换行拆为三行其中 HTML 被#ff3b6f高亮章节标记进 header captiontimecode 显示为00:03:21来源句成为副标。因此example_desc光标打字 hot pink cyan 像散, 视频开场用、example_tagline逐字揭示 chromatic 拖光都能在 example.html 里找到对应实现。这套配对让模板从纯指令变成可预览、可复现的完整单元用户点开模板的 Preview看到的正是 Agent 应当产出的效果。加载时机上loader 在扫描目录时检查example.html/example.md是否存在loader.ts并将它们与 frontmatter 的 example 字段一起组装成SkillExampleMetahasHtml/hasMd布尔标记loader.ts。前端 picker 据此决定是否展示预览入口。四、从磁盘到浏览器模板的完整加载链路vfx-text-cursor 在运行时如何被使用链路如下元数据列表GET /api/templates调用 listSkills扫描src/lib/templates/skills/下所有合法 kebab-case 目录含 marketplace 安装到~/.html-anything/skills/的用户技能ID 会加pkg-owner-repo--前缀loader.ts。注意这里只返回SkillMeta排除正文保证一次请求拉全量注册表也不会把提示词文本泄露给浏览器loader.ts。生产环境有metaCache开发环境跳过缓存以便新增技能即时可见loader.ts。响应带Cache-Control: public, max-age5templates/route.ts。示例获取GET /api/templates/:id/example调 loadSkill一次返回 contentexample.md与 htmlexample.html的 JSON 包——注释写明这是为了让 picker 点Preview时免去两次往返example/route.ts。提示词组装用户选定模板并提交内容后POST /api/convert调assemblePrompt({ body, content, format })把全局设计准则 SKILL.md 正文 输入格式 用户内容拼成完整提示词convert/route.ts若带editFromHtml/editFromContent则改走最小化 diff-edit 提示词保留设计只改内容convert/route.ts。Agent 调用与流式返回invokeAgent拿到提示词调用本地 Agent CLIClaude Code / Cursor / Codex 等零 API key结果以 SSE 事件流返回前端convert/route.ts。前端捕获 stdout 文本即为 HTML落盘与预览由前端完成——这正是 SKILL.md 与全局准则里禁止文件系统工具的原因。客户端侧index.ts 的useTemplates()对/api/templates做模块级缓存 in-flight 去重并用 generation 令牌解决慢的旧请求覆盖新列表的竞态index.ts安装/卸载后调refreshTemplates()立即把新列表推给所有已挂载的消费方index.ts。五、动手实践复用与扩展 vfx-text-cursor 的完整清单要在自己的 html-anything 实例里复现或扩展这个模板查看next/src/lib/templates/skills/vfx-text-cursor/目录下三个文件SKILL.md 是灵魂指令example.html 是标准答案example.md 是输入样例复用在编辑器如 Claude Code / Cursor里选中该模板提交金句内容/api/convert会带上前述完整提示词让 Agent 生成单文件 HTML生成后可直接在沙箱预览或通过导出菜单转成 PNG / 导出 HTML 用于剪辑软件新增同类模板复制该目录 → 改 frontmattername必须是 kebab-case 合法 ID见 loader.ts与正文 → 附上自己的 example.md / example.html → 刷新页面新技能即出现在 picker。开发模式下 loader 不缓存无需重启next dev保持红线逐字揭示别忘prefers-reduced-motion降级、chromatic 只做二元像散、字体走 Inter Tight / Noto Sans SC——这些约束在示例里都有对应实现是 Agent 输出质量的锚点。结语vfx-text-cursor 是 html-anything一目录一技能体系的一个典型切片一份自然语言指令SKILL.md 一组示例对example.md / example.html经由磁盘扫描、注册表 API 与提示词组装器变成 Agent 可执行的、面向 1920×1080 视频开场帧的生成任务。理解它的结构就等于掌握了给这个项目贡献任何新技能模板的通用方法论——指令定约束、示例定标准、加载链路定可用性三者缺一不可。赞分享AI 应用人工智能AI AgentAI 写作媒体生成【免费下载链接】html-anything✨ The agentic HTML editor — your local AI agent writes the HTML, you ship it. 75 Skills × 9 Surfaces (magazine · deck · poster · XHS / tweet · prototype · data report · Hyperframes) ️ Sandboxed preview · 1-click to WeChat / X / Zhihu / HTML / PNG Zero API key — Claude Code / Cursor / Codex / Gemini / Copilot / OpenCode / Qwen / Aider.项目地址https://gitcode.com/gh_mirrors/ht/html-anything点击查看免费下载相关推荐HTML Anything 技能解析用 Glitch Title Frame 故障艺术标题帧模板生成视频转场与 Cyberpunk 单帧 HeroHTML Anything 技能解析用 Glitch Title Frame 故障艺术标题帧模板生成视频转场与 Cyberpunk 单帧 Hero 故障艺术AI 应用人工智能AI AgentAI 写作媒体生成OWASP WrongSecrets 项目教程OWASP WrongSecrets 项目教程 1. 项目的目录结构及介绍 wrongsecrets/ ├── src/ │ ├── main/ │ │ ├──AI 应用人工智能AI AgentAI 写作媒体生成Windows热键冲突终极解决方案3分钟定位热键小偷的完整指南Windows热键冲突终极解决方案3分钟定位热键小偷的完整指南 你是否曾经按下熟悉的快捷键却没有任何反应当 CtrlS 不再保存文件 AltTabAI 应用人工智能AI AgentAI 写作媒体生成上一篇CopyTranslator 起源与核心技术解析从双栏 PDF 换行痛点走向复制即翻译下一篇如何用WeWe RSS生成微信公众号RSS部署、配置与排障实践创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 html-anything 模板体系解析：用 VFX 文字光标在视频开场帧里逐字揭示金句
AI 应用人工智能AI AgentAI 写作媒体生成【免费下载链接】html-anything✨ The agentic HTML editor — your local AI agent writes the HTML, you ship it. 75 Skills × 9 Surfaces (magazine · deck · poster · XHS / tweet · prototype · data report · Hyperframes) ️ Sandboxed preview · 1-click to WeChat / X / Zhihu / HTML / PNG Zero API key — Claude Code / Cursor / Codex / Gemini / Copilot / OpenCode / Qwen / Aider.项目地址https://gitcode.com/gh_mirrors/ht/html-anything点击查看免费下载导读本文以 html-anything 仓库中 vfx-text-cursor 技能模板 为核心拆解一个面向「视频开场 / Hero 帧」的 AI 生成模板的完整设计从 SKILL.md 的 frontmatter 与指令正文到同目录example.md/example.html的配套示例再到它在模板注册表、预览与转换 API 中的落盘加载链路。读完你可以掌握这类打字光标 chromatic 拖光动效模板的参数语义、设计红线与实现方式以及给 html-anything 新增一个同类技能模板需要准备的完整文件结构。前置说明SKILL.md 是一份给 AI Agent 的自然语言指令模板正文它不直接描述项目代码而是约束当用户选中此模板时Agent 应该如何生成 HTML。因此本文的源码级证据主要取自模板加载器 loader.ts、提示词组装器 shared.ts 与转换 API route.ts以说明这份指令如何被读取、如何与全局设计准则拼接、最终如何流式返回给前端。一、模板是什么一张 SKILL.md 的完整骨架html-anything 采用一技能一目录的磁盘注册表结构。每个模板是一个目录src/lib/templates/skills/id/ SKILL.md # frontmatterid、scenario、tags… prompt 正文 example.md # 可选示例输入内容 example.html # 可选预渲染预览picker 内联展示见 loader.ts 的目录常量与注释。vfx-text-cursor 正是这种结构下的一个完整案例SKILL.md 负责告诉 Agent 怎么画example.md 提供一段可复用的金句输入example.html 是这套指令的标准答案——两者共同构成example_id: sample-vfx-text-cursor的示例组。新增模板 新建一个文件夹无需改动 TS 代码。API 路由会重新扫描磁盘客户端重新拉取/api/templates即可见 loader.ts。1.1 frontmatter让模板可被发现、可被分类vfx-text-cursor 的 frontmatter 完整列出字段值含义name/zh_name/en_namevfx-text-cursor/ VFX 文字光标 / VFX Text Cursor模板 ID 与双语展示名emoji✨picker 图标description光标拖光 彩色像散射线 定向光斑, 适合视频片头逐字揭示金句一句话介绍category/scenariovideo/video分类与场景键对应 picker 筛选 chipaspect_hint1920×1080 (16:9)画布尺寸提示会拼进 diff-edit 提示词featured/recommended38 / 7排序权重recommended越小越靠前见 loader.tstags[vfx,text,cursor,chromatic,reveal,frame]检索标签example_id等sample-vfx-text-cursor示例元数据仅当存在 example.md/html 时生效loader.tsloader 用零依赖的正则解析这套扁平 frontmatterloader.ts支持字符串可带引号、整数与一行数组字面量——tags: [...]会被拆成数组featured/recommended会Number()转换。scenario: video落在 scenarios.ts 的SCENARIO_KEYS白名单里因此 picker 能用 i18n 的template.scenario.video显示中文标签不在白名单的 scenario 则归入末尾的 other 桶、以原始 key 显示scenarios.ts。二、SKILL.md 正文一份可执行的分镜脚本SKILL.md 去掉 frontmatter 后的正文body就是 Agent 生成 HTML 的模板级指令被 assemblePrompt 夹在全局设计准则与用户内容之间整体构成最终提示词。其结构可拆为四层2.1 意图与画布分镜的场正文开篇明确这是视频开场 / Hero 帧——光标在画布上打字文字逐字浮现后面拖着彩色像散尾迹 定向光斑。画布固定1920×1080背景用#06070a暗哑黑或#0a0d12暖偏蓝并加微妙 vignette暗角。这正是 example.html 里.vignette的实现radial-gradient(circle at center, transparent 50%, rgba(0,0,0,0.8) 100%)配合mix-blend-mode: overlay的 SVGfeTurbulence噪点层.grainopacity 0.06给纯黑底增加质感——这两个层在 example 里以绝对定位覆盖全屏z-index 1~2文字层 z-index 10 保持在前。2.2 内容与排版金句的镜指令给出具体排版规格金句一行或多行居中字号6-8vwexample 用clamp(48px,7vw,108px)weight 700example 用font-black即 900字体Inter Tight/Source Sans 3/Noto Sans SCexample 实际引入 Inter Tight 400/700/800/900 Noto Sans SC 400/700/900逐字揭示每个字符 80ms 间隔当前字符后跟▍光标example 用 CSS 方块光标.cursor18px 宽、height:1.05emblink 1s steps(1) infinite即 1.0s 周期步进闪烁已揭示文字默认白色#f5f5f7即将揭示位置加chromatic ghosttext-shadow: 2px 0 #ff3b6f, -2px 0 #00d4ff在 reveal 瞬间出现、200ms 内收敛回正常光标颜色 accenthot pink#ff3b6f/ cyan#00d4ff/ amber#ffb547三选一后面拖 60-120px 的 motion blur trail径向渐变到透明。example.html 印证了这三条.cursor的box-shadow: 0 0 24px #ff3b6f, 0 0 8px #ff3b6f, 60px 0 80px rgba(255,59,111,0.6)—— 前两层是发光第三层60px 0 80px正是光标右侧拖一条约 60px 的辉光尾迹.chroma类则实现3px 0 #00d4ff / -3px 0 #ff3b6f的二元像散与 40px 的 pink 外发光。注意text-shadow同时压 cyan 在右、hot pink 在左与 frontmatter 的示例 tagline「HOT PINK × CYAN CHROMATIC」完全一致。2.3 光斑与射线氛围层打字位置附近随机生成 3-5 道定向光斑light leak细长矩形linear-gradient(45deg, transparent, accent20, transparent)mix-blend-mode: screen不规则角度。example 落地为三条.ray.ray-1hot pink 60% 宽 /.ray-2cyan 50% 宽 /.ray-3amber 40% 宽各自rotate(-12deg / 15deg / -8deg)并加 5-8px blurz-index 1 压在文字下方——这正是截图里淡粉、淡蓝光线的来源。文字全部打完后再加 0.5sshimmer sweep光带横扫全段。2.4 字段区帧内信息帧内四角信息是开场帧的可信度来源顶部 captionFRAME 01 · OPENINGuppercase、letterspace 0.18em、11px、opacity 0.5文字下方副标24-28px、opacity 0.6来源 / 章节example 为 — Claude Code 团队, 2026右下角 timecode00:03:21mono 字体example 用 JetBrains Mono且右上角补了VFX · TEXT CURSOR、底部 footer 补了HTML-ANYTHING · VFX-TEXT-CURSOR与REC ●增强摄像机取景框的氛围。2.5 设计红线负向约束指令以「绝不」开头的硬约束是这类模板质量的关键禁止多色彩虹 chromatic只用 hot pink cyan 二元像散不做 R/G/B 全色字体白名单西文Inter TightBold、中文Noto Sans SCBold严禁衬线动效keyframes JSsetTimeout逐字且必须可被prefers-reduced-motion关闭直接显示全部文字——这是无障碍硬性要求内容真实性必须用用户提供的金句不捏造与全局设计准则的内容真实性一节呼应单文件除字体外不外链资源。这些约束会直接进入最终提示词与 shared.ts 的全局准则合并。全局准则还额外要求禁止文件系统工具纯 stdout 流式输出 HTML不以 markdown 围栏包裹等保证 Agent 的产出能被前端直接捕获。三、配套示例example.md 与 example.html 的配对关系模板自带示例是一个输入→输出对example.md极简的 Markdown 输入只有金句Markdown 是给作者的中间过程, HTML 才是给读者的最终形态、章节标记FRAME 01 · OPENING与 Timecode00:03:21三个字段example.html上述三个字段的标准渲染——金句成为 h1 主体换行拆为三行其中 HTML 被#ff3b6f高亮章节标记进 header captiontimecode 显示为00:03:21来源句成为副标。因此example_desc光标打字 hot pink cyan 像散, 视频开场用、example_tagline逐字揭示 chromatic 拖光都能在 example.html 里找到对应实现。这套配对让模板从纯指令变成可预览、可复现的完整单元用户点开模板的 Preview看到的正是 Agent 应当产出的效果。加载时机上loader 在扫描目录时检查example.html/example.md是否存在loader.ts并将它们与 frontmatter 的 example 字段一起组装成SkillExampleMetahasHtml/hasMd布尔标记loader.ts。前端 picker 据此决定是否展示预览入口。四、从磁盘到浏览器模板的完整加载链路vfx-text-cursor 在运行时如何被使用链路如下元数据列表GET /api/templates调用 listSkills扫描src/lib/templates/skills/下所有合法 kebab-case 目录含 marketplace 安装到~/.html-anything/skills/的用户技能ID 会加pkg-owner-repo--前缀loader.ts。注意这里只返回SkillMeta排除正文保证一次请求拉全量注册表也不会把提示词文本泄露给浏览器loader.ts。生产环境有metaCache开发环境跳过缓存以便新增技能即时可见loader.ts。响应带Cache-Control: public, max-age5templates/route.ts。示例获取GET /api/templates/:id/example调 loadSkill一次返回 contentexample.md与 htmlexample.html的 JSON 包——注释写明这是为了让 picker 点Preview时免去两次往返example/route.ts。提示词组装用户选定模板并提交内容后POST /api/convert调assemblePrompt({ body, content, format })把全局设计准则 SKILL.md 正文 输入格式 用户内容拼成完整提示词convert/route.ts若带editFromHtml/editFromContent则改走最小化 diff-edit 提示词保留设计只改内容convert/route.ts。Agent 调用与流式返回invokeAgent拿到提示词调用本地 Agent CLIClaude Code / Cursor / Codex 等零 API key结果以 SSE 事件流返回前端convert/route.ts。前端捕获 stdout 文本即为 HTML落盘与预览由前端完成——这正是 SKILL.md 与全局准则里禁止文件系统工具的原因。客户端侧index.ts 的useTemplates()对/api/templates做模块级缓存 in-flight 去重并用 generation 令牌解决慢的旧请求覆盖新列表的竞态index.ts安装/卸载后调refreshTemplates()立即把新列表推给所有已挂载的消费方index.ts。五、动手实践复用与扩展 vfx-text-cursor 的完整清单要在自己的 html-anything 实例里复现或扩展这个模板查看next/src/lib/templates/skills/vfx-text-cursor/目录下三个文件SKILL.md 是灵魂指令example.html 是标准答案example.md 是输入样例复用在编辑器如 Claude Code / Cursor里选中该模板提交金句内容/api/convert会带上前述完整提示词让 Agent 生成单文件 HTML生成后可直接在沙箱预览或通过导出菜单转成 PNG / 导出 HTML 用于剪辑软件新增同类模板复制该目录 → 改 frontmattername必须是 kebab-case 合法 ID见 loader.ts与正文 → 附上自己的 example.md / example.html → 刷新页面新技能即出现在 picker。开发模式下 loader 不缓存无需重启next dev保持红线逐字揭示别忘prefers-reduced-motion降级、chromatic 只做二元像散、字体走 Inter Tight / Noto Sans SC——这些约束在示例里都有对应实现是 Agent 输出质量的锚点。结语vfx-text-cursor 是 html-anything一目录一技能体系的一个典型切片一份自然语言指令SKILL.md 一组示例对example.md / example.html经由磁盘扫描、注册表 API 与提示词组装器变成 Agent 可执行的、面向 1920×1080 视频开场帧的生成任务。理解它的结构就等于掌握了给这个项目贡献任何新技能模板的通用方法论——指令定约束、示例定标准、加载链路定可用性三者缺一不可。赞分享AI 应用人工智能AI AgentAI 写作媒体生成【免费下载链接】html-anything✨ The agentic HTML editor — your local AI agent writes the HTML, you ship it. 75 Skills × 9 Surfaces (magazine · deck · poster · XHS / tweet · prototype · data report · Hyperframes) ️ Sandboxed preview · 1-click to WeChat / X / Zhihu / HTML / PNG Zero API key — Claude Code / Cursor / Codex / Gemini / Copilot / OpenCode / Qwen / Aider.项目地址https://gitcode.com/gh_mirrors/ht/html-anything点击查看免费下载相关推荐HTML Anything 技能解析用 Glitch Title Frame 故障艺术标题帧模板生成视频转场与 Cyberpunk 单帧 HeroHTML Anything 技能解析用 Glitch Title Frame 故障艺术标题帧模板生成视频转场与 Cyberpunk 单帧 Hero 故障艺术AI 应用人工智能AI AgentAI 写作媒体生成OWASP WrongSecrets 项目教程OWASP WrongSecrets 项目教程 1. 项目的目录结构及介绍 wrongsecrets/ ├── src/ │ ├── main/ │ │ ├──AI 应用人工智能AI AgentAI 写作媒体生成Windows热键冲突终极解决方案3分钟定位热键小偷的完整指南Windows热键冲突终极解决方案3分钟定位热键小偷的完整指南 你是否曾经按下熟悉的快捷键却没有任何反应当 CtrlS 不再保存文件 AltTabAI 应用人工智能AI AgentAI 写作媒体生成上一篇CopyTranslator 起源与核心技术解析从双栏 PDF 换行痛点走向复制即翻译下一篇如何用WeWe RSS生成微信公众号RSS部署、配置与排障实践创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考