Individual skill

beautiful-article

把用户提供的素材（网页 URL / PDF / DOCX / Markdown / 纯文本 / 截图 / 粘贴材料）编辑、设计成一篇美丽的、可离线打开和分享的**单文件 HTML 网页文章**。基于 reacticle 组件协议：不手写裸 HTML/CSS，而用语义组件 + 受主题约束的 Raw 自由层；按 source→规划→双确认→生成→终审→修复的小型 harness 流程推进，默认 100% 信息保留的长文。触发场景：把 URL/PDF/DOCX/文章做成网页文章 / 长文 / briefing / 解释文 / 视觉文章 / 教程 / 审阅复盘 / 方案分析，'render this as a beautiful web article / 把这篇做成网页文章 / 生成一篇可分享的 HTML 长文 / reacticle 文章'。只生成文章，不生成后台、表单、dashboard、产品原型或通用 Web App。

skills/beautiful-article/SKILL.md

Read pinned source

Source commit 2b9a89340b70f632d31c0f1c69fce94a7912423e

What was checked

Matches the observed repository HEAD: Yes
Scanner rules are current: Yes
Repository scan complete: No
Skill scan complete: No
Observed behavior: Network or broad shell
Last checked: Nov 9, 2026

These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.

Install this skill

Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.

An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.

Repository context

Repository stars (not skill ratings): 14,956
Repository last updated: Nov 8, 2026
License: MIT

Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.

agent Repository topic
claude Repository topic
gpt-image-2 Repository topic
rag Repository topic
skills Repository topic
web-design Repository topic
engineering Derived category

Files and excerpt

File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.

Browse files

README.mddoc · 24,181 bytes
README.zh-CN.mddoc · 23,731 bytes
SKILL.mdcore · 31,482 bytes
SKILL.mdcore · 31,482 bytes
SKILL.mdcore · 31,482 bytes
SKILL.mdcore · 31,482 bytes
SKILL.mdcore · 31,482 bytes
assets/scaffold-template/.npmrcasset · 37 bytes
assets/scaffold-template/article/Article.tsxruns · 2,811 bytes
assets/scaffold-template/article/Cover.tsxruns · 7,660 bytes
assets/scaffold-template/article/main.tsxruns · 1,173 bytes
assets/scaffold-template/article/sections/01-opening.tsxruns · 1,314 bytes
assets/scaffold-template/index.htmlasset · 755 bytes
assets/scaffold-template/package.jsonruns · 783 bytes
assets/scaffold-template/tsconfig.jsonasset · 512 bytes
assets/scaffold-template/tsconfig.node.jsonasset · 230 bytes
assets/scaffold-template/vite.config.tsruns · 614 bytes
manifest.jsonasset · 733 bytes
references/article-types.mddoc · 3,767 bytes
references/article-types/briefing.mddoc · 2,177 bytes
references/article-types/dialogue.mddoc · 2,181 bytes
references/article-types/essay.mddoc · 2,129 bytes
references/article-types/explainer.mddoc · 2,388 bytes
references/article-types/full-report.mddoc · 2,422 bytes
references/article-types/interactive-explainer.mddoc · 5,042 bytes
references/article-types/longform.mddoc · 2,325 bytes
references/article-types/review.mddoc · 2,342 bytes
references/article-types/tutorial.mddoc · 2,268 bytes
references/article-types/visual-essay.mddoc · 2,504 bytes
references/asset-policy.mddoc · 3,833 bytes
references/component-policy.mddoc · 5,543 bytes
references/cover.mddoc · 11,868 bytes
references/harness.mddoc · 2,123 bytes
references/html-output.mddoc · 1,988 bytes
references/information-density.mddoc · 3,238 bytes
references/layout.mddoc · 2,003 bytes
references/pdf-output.mddoc · 10,041 bytes
references/plan-template.mddoc · 5,851 bytes
references/raw-policy.mddoc · 4,485 bytes
references/repair-policy.mddoc · 1,236 bytes
references/review-checklist.mddoc · 7,312 bytes
references/scaffold.mddoc · 3,602 bytes
references/section-build.mddoc · 5,405 bytes
references/source-to-markdown.mddoc · 6,401 bytes
references/theme-selection.mddoc · 2,301 bytes
scripts/html-to-pdf.shruns · 6,377 bytes
scripts/pdf-print-overrides.cssasset · 6,457 bytes
scripts/scaffold.shruns · 7,516 bytes
scripts/source-to-markdown-markitdown.pyruns · 3,308 bytes
scripts/source-to-markdown.pyruns · 5,992 bytes
theme-profiles/andy.mddoc · 3,426 bytes
theme-profiles/bayer.mddoc · 3,198 bytes
theme-profiles/bodoni.mddoc · 3,307 bytes
theme-profiles/freddie.mddoc · 3,420 bytes
theme-profiles/fuller.mddoc · 3,276 bytes
theme-profiles/index.jsonasset · 5,912 bytes
theme-profiles/knuth.mddoc · 3,603 bytes
theme-profiles/press.mddoc · 3,633 bytes
theme-profiles/shannon.mddoc · 3,831 bytes
theme-profiles/sottsass.mddoc · 3,420 bytes
theme-profiles/tufte.mddoc · 3,621 bytes
theme-profiles/vignelli.mddoc · 3,655 bytes

Read excerpt


# Beautiful Article

## 背景原则

AI 生成内容越复杂，输出媒介越重要。HTML 的价值在于同时提升信息密度、视觉清晰度、分享便利性和交互能力：表格、SVG、CSS、代码片段、可调控件、复制与导出按钮，可以让读者不只是“看完”，而是能比较、定位、调整、复查和继续使用。Beautiful Article 的目的，是把原本枯燥、线性、难以消化的文字材料，转换成视觉体验更漂亮、阅读节奏更清晰、也更容易审阅和分享的单文件网页文章。


## 边界（先判断要不要进这个 Skill）

- 最终主产物是 **single HTML 文章**，不是网页应用。
- 文章可以有 `Raw` 自由层（任意 HTML / CSS / JS / React：交互、布局排版、动效、小工具、
  按需的 SVG / canvas 图解），但**必须服务阅读、解释、论证、节奏或审美**。
- **不**生成：后台、表单、拖拽工作台、完整 dashboard、产品原型、通用 Web App。
- 信息密度由用户确认；**默认保留 100% 信息**，生成长文式网页文章。