← 返回 Skills 市场
Article To Html
作者
johney.zhoa
· GitHub ↗
· v1.0.0
· MIT-0
185
总下载
0
收藏
1
当前安装
1
版本数
在 OpenClaw 中安装
/install article-to-html
功能描述
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
使用说明 (SKILL.md)
文章转 HTML 信息图
文章 → 提炼核心信息 → 生成 HTML 信息图 → 后处理 → 截图交付。
设计理念
你是设计师，不是模板填充机。 根据文章内容自由设计视觉风格，不要每次都用同一个模板。
- 内容决定形式 — 严肃分析用深色/衬线，轻松科普用手账/波普，技术教程用终端/蓝图
- 信息精炼 — 一张图讲清一个核心论点 + 3-4 个支撑模块，不是把文章全文塞进去
- 手机第一 — 图片在手机上缩放 3 倍，字号必须够大（详见
rules/01-技术底线.md） - 每次不同 — 配色、字体、布局每次都应该有变化，避免千篇一律
工作流程
用户给文章
↓
① 内容分析 — 提取核心论点、关键数据、对比维度、避坑要点、金句
↓
② 自由设计 — 根据内容调性，自主决定视觉风格、配色、布局
（可参考 rules/03-风格灵感.md 和 templates/ 获取灵感）
↓
③ 生成 HTML — 自包含 HTML，必须遵守 rules/01-技术底线.md
↓
④ 后处理 — 生成后立即执行：
bash ~/.openclaw/skills/article-to-html/scripts/post-process.sh \x3Chtml文件>
↓
⑤ 截图交付 — 按 rules/02-截图流程.md 执行
步骤④ 是强制的。 无论你对自己生成的 HTML 多有信心，都必须跑后处理脚本。
目录结构
| 目录/文件 | 地位 | 说明 |
|---|---|---|
rules/01-技术底线.md |
必读 | 字号、宽度、overflow 等硬性约束 |
rules/02-截图流程.md |
必读 | Chrome DevTools 截图 5 步流程 |
rules/03-风格灵感.md |
参考 | 9 种风格的配色/字体/特征，用于激发灵感 |
templates/ |
参考 | 9 个 HTML 模板，可浏览获取灵感，不要照抄 |
scripts/post-process.sh |
工具 | 一键后处理（fix CSS + 注入字号兜底） |
scripts/fix-html.js |
工具 | CSS 修复脚本（被 post-process.sh 调用） |
安全使用建议
This skill appears to do what it says (generate HTML infographics) but there are two things to verify before installing/using it: (1) Mandatory script execution — SKILL.md forces running scripts/post-process.sh (which calls scripts/fix-html.js). Open and read those scripts first to confirm they only modify the generated HTML/CSS and do not perform unexpected network calls, shelling out, or credential access. If you can't read them, treat execution as risky. (2) "Self-contained" mismatch — example outputs import Google Fonts; opening rendered HTML will cause outbound requests to Google (possible metadata leak). If you need truly offline/self-contained output, remove external @import lines or host fonts locally. Recommended safe steps: review the two scripts line-by-line, run the skill in an isolated/sandboxed environment, and ensure your workflow does not expose sensitive content (private notes, credentials) to an environment that will make external network requests.
功能分析
Type: OpenClaw Skill
Name: article-to-html
Version: 1.0.0
The skill bundle is a utility designed to transform text articles into HTML-based infographics. It utilizes a combination of shell scripts (post-process.sh), Node.js (fix-html.js), and Python one-liners to perform local CSS adjustments and layout fixes on AI-generated HTML files. The logic is transparent, lacks any network activity or data exfiltration attempts, and strictly adheres to the stated purpose of optimizing document layouts for mobile-friendly screenshots.
能力评估
Purpose & Capability
Name/description, templates, rules, and output HTML files all align with converting articles to phone-ready HTML infographics. However the docs claim "all styles inline, no external dependencies" while several example outputs include @import(...) from Google Fonts — this contradicts the "self-contained" claim and is unexpected for the stated promise.
Instruction Scope
SKILL.md requires a mandatory post-processing step: bash ~/.openclaw/skills/article-to-html/scripts/post-process.sh <html文件>. The package includes two local scripts (post-process.sh and fix-html.js). A skill that mandates executing a shell script during runtime expands its privileges and can perform arbitrary file/network/system actions; the script contents were not provided in the runtime instructions excerpt, so the exact behavior (network calls, file writes, command execution) cannot be verified. The workflow also references invoking Chrome for screenshots if configured, which is reasonable, but the forced execution of an included shell script is a risk and should be reviewed.
Install Mechanism
There is no install spec (instruction-only), which minimizes remote code fetching risks. However the skill ships with local scripts that the agent will execute; because there is no install step, the files are expected to already live in ~/.openclaw/skills/article-to-html and will be run directly. That is a lower-distribution risk than downloading code at runtime, but running local shell/Node scripts remains sensitive and should be audited.
Credentials
The skill requests no environment variables, credentials, or config paths — appropriate for its purpose. Caveat: example outputs embed external font imports (Google Fonts). Rendering or previewing these HTML files may cause the host environment to make outbound requests to Google, which can leak metadata (IP, referrer, timing) about when/what was rendered. Also some template output includes references to other projects (harmless-looking), but the primary risk is network fetches from fonts/CSS when opening the files.
Persistence & Privilege
always:false and no declared attempts to modify other skills or system-wide settings. The skill does instruct writing generated HTML files to the working directory and running its own post-process script, which may modify those files, but this is within the skill's scope and not a platform-level privilege escalation.
如何使用
- 确保已安装 OpenClaw（本地或 Docker 部署）
- 在对话框中输入安装命令：
/install article-to-html - 安装完成后，直接呼叫该 Skill 的名称或使用
/article-to-html触发 - 根据 Skill 的参数说明提供必要输入，即可获得结构化输出
版本历史
v1.0.0
Initial release of article-to-html: turn articles or notes into visually styled, mobile-friendly HTML infographics.
- Extracts and refines key points from articles for concise infographics.
- Designs unique visual styles based on content—no repetitive templates.
- Ensures mobile-first layouts with enhanced readability.
- Provides a structured workflow: analysis, design, HTML generation, post-processing, and delivery.
- Includes guides for style inspiration, technical constraints, and screenshot procedures.
元数据
常见问题
Article To Html 是什么？
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。 它是一个面向 Claude Code / OpenClaw 的 AI Agent Skill 插件，目前累计下载 185 次。
如何安装 Article To Html？
在 OpenClaw 或 Claude Code 对话框中运行命令「/install article-to-html」即可一键安装，无需额外配置。
Article To Html 是免费的吗？
是的，Article To Html 完全免费，采用 MIT-0 许可证，可自由下载、安装和使用。
Article To Html 支持哪些平台？
Article To Html 跨平台运行，可在任意部署了 OpenClaw / Claude Code 的环境中使用（cross-platform）。
谁开发了 Article To Html？
由 johney.zhoa（@partigle）开发并维护，当前版本 v1.0.0。
推荐 Skills