← Back to Skills Marketplace

Article To Html

Name: Article To Html
Author: partigle

by johney.zhoa · GitHub ↗ · v1.0.0 · MIT-0

cross-platform ⚠ suspicious

185

Downloads

Stars

Active Installs

Versions

Install in OpenClaw

/install article-to-html

Description

文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。

README (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 调用）

Usage Guidance

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.

Capability Analysis

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.

Capability Assessment

ℹ 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.

How to Use

Make sure OpenClaw is installed (local or Docker)
Run the install command in chat: /install article-to-html
After installation, invoke the skill by name or use /article-to-html
Provide required inputs per the skill's parameter spec and get structured output

Version History

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.

Metadata

Slug article-to-html

Version 1.0.0

License MIT-0

All-time Installs 2

Active Installs 1

Total Versions 1

Frequently Asked Questions

What is Article To Html?

文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。 It is an AI Agent Skill for Claude Code / OpenClaw, with 185 downloads so far.

How do I install Article To Html?

Run "/install article-to-html" in the OpenClaw or Claude Code chat to install it in one step — no extra setup required.

Is Article To Html free?

Yes, Article To Html is completely free, licensed under MIT-0. You can download, install and use it at no cost.

Which platforms does Article To Html support?

Article To Html is cross-platform and runs anywhere OpenClaw / Claude Code is available (cross-platform).

Who created Article To Html?

It is built and maintained by johney.zhoa (@partigle); the current version is v1.0.0.

More Skills