WeChat's article editor silently strips <style> tags, <div> wrappers, class attributes, position, float, grid, @media, CSS variables, and external fonts. Paste in styled HTML and it collapses. gzh-design-skill treats that hostile target as the whole design problem: it is an AI-agent skill whose only job is to turn finished Markdown into HTML that survives the paste.
What it actually does
The skill takes Markdown you already wrote and assembles paste-ready HTML for the WeChat public-account (公众号) editor. It applies one of six built-in themes, numbers your sections automatically, underlines one to three keywords per paragraph, pulls a pull-quote card and table of contents out of your body text, formats code blocks and images, and merges a deduplicated author signature. Every style is inlined and every text node is wrapped in <span leaf="">, which is the specific shape WeChat's editor preserves rather than filters.
The authors are explicit about the boundary: this skill does not write for you. The README lists "代写文章" (ghostwriting the article) under what it is not for. You bring the Markdown; it handles typesetting. It also names formats it is wrong for, including landing pages, slide decks, and social cards, and points you at other skills for those.
The six themes are not color swaps. Each ships as its own component library with a design-variable palette, dozens of components, a visual-hierarchy table, and a "recipe table" that maps article types to component combinations. The defaults cover opinion pieces, tutorials, tool round-ups, data recaps, and minimalist essays. Named examples include 摸鱼绿 (the emerald #059669 default), a red-and-white editorial theme at #DC2626, a graphite minimal theme, and an olive "notebook" theme for internal-publication material.
The part worth studying
Most Markdown-to-HTML converters lean on the model to remember platform rules. gzh-design-skill inverts that. It ships two Python validators and treats compliance as a script problem, not a prompt problem. component_lint.py checks the component libraries at the source for anti-patterns like white-space:pre and dashed boxes around body text. validate_gzh_html.py checks the final HTML for banned tags, correct <span leaf> wrapping, and half-width punctuation that should be full-width. The stated rule is zero ERROR before delivery, and the logic is straightforward: if the source libraries are clean, the output is clean too.
That is the design thesis the README returns to repeatedly under "为什么这么设计": constraint over freedom. Preset palettes and fixed components hold a floor on quality so the model is not improvising a fresh look every run. Hard platform limits go to deterministic scripts so quality does not depend on the model "remembering." The authors claim this makes the skill model-agnostic. Because the typesetting logic lives in the component libraries and validators rather than any one model's behavior, they say Claude, GPT, Gemini, and domestic models like DeepSeek, Kimi, and GLM all produce consistent results. Input and output are plain Markdown and HTML, so the skill is meant to run under Claude Code, Codex, or Cursor equally.
There is also a theme generator. Give it a one-line description or a reference image and it produces a fresh component library of 45 to 75 blocks, saves an HTML preview for you to review as a whole page, then converts the approved version into a standard theme file and registers it. The README documents a five-role color structure behind this: a brand primary used sparingly, a light background derived from it, a contrasting highlight, a neutral gray scale carrying about 90 percent of the text, and a soft underline tint. The restraint rules it states are concrete: primary color at five anchor points or fewer across a whole article, gray scale carrying the reading load, at most two highlights per paragraph.
Reading the fine print
A few honest caveats. The repo is young, created on 2026-07-01, and its roughly 1,196 stars accrued fast, so treat adoption as early rather than proven. The license is AGPL-3.0, which the README spells out plainly: derivatives, forks, and even hosted SaaS deployments must publish source. That matters if you want to fold this into a closed product. The README's install snippets and its "ask your agent to install this" phrasing are the authors' own copy; as with any skill you pull from a repo, read SKILL.md and the scripts before wiring it into an autonomous agent rather than pasting install commands on faith. What the README does not include is any independent benchmark of paste fidelity, so the "格式不掉" promise rests on the validators the project ships rather than outside measurement. For anyone publishing regularly to WeChat, the deterministic-validation approach alone makes gzh-design-skill worth a close look.
GitHub: https://github.com/isjiamu/gzh-design-skill
Curated by Agent Palisade — practical AI for small and mid-sized businesses.
Top comments (0)