前言¶
公众号正文样式往往要手写或改 CSS，再对照编辑器里的实际 DOM 反复调。通用网页主题不能直接套：选择器、资源引用方式和字体限制都和普通站点不一样。若你已经在用 Markdown 转公众号排版（例如基于 #wenyan 命名空间的工具链），更需要一套能被 Agent 稳定执行的生成规则，而不是每次让模型「自由发挥」样式。
下面介绍 SkillHub 社区技能 微信公众号自定义主题生成器（坐标 @user_d8946e26/generate-wenyan-theme）。它把「视觉需求 → 可落地的 CSS 文件」写成 Agent 可读的 SKILL 规范，并强调微信侧最容易踩坑的命名空间与资源约束。
这是什么¶
微信公众号自定义主题生成器 是面向 AI Agent 的 Skill（基于通用 SKILL.md 格式），由社区发布者 user_d8946e26 维护，当前版本 1.0.0，分类为 design-media，来源为 community。
官方一句话定位（与 Skill 元数据一致）：
AI-ready skill to design and generate highly customized CSS themes for WeChat Official Accounts.
它解决的是：根据自然语言描述设计与生成高度定制化的 CSS 主题，并仅负责生成 CSS 代码并保存为本地文件（不负责公众号后台的 HTML 排版或一键发布）。Skill 标注 requires_api_key=false，安装使用不依赖额外 API Key。
SkillHub 页面（截至资料抓取）：评分 100000，下载 1301，安装 91。
- 技能页：https://www.skillhub.cn/skills/user_d8946e26/generate-wenyan-theme
- API 标识：https://api.skillhub.cn/user_d8946e26/generate-wenyan-theme
核心功能¶
以下能力均来自该 Skill 自带的 SKILL.md 说明。
自然语言转 CSS¶
Agent 读取技能后，应能理解用户的视觉需求（例如赛博朋克风、带装饰的引用块、深色代码块等），并输出对应的 CSS，而不是只给设计建议。
微信排版规范适配¶
生成代码须严格遵循 #wenyan 命名空间：所有选择器必须以 #wenyan 开头，中间用空格与元素选择器分隔。缺少前缀的样式在目标 DOM 中不会生效。
示例（技能内给出的对错对照）：
/* 正确 */
#wenyan h1 { color: red; }
/* 错误 */
h1 { color: red; }
字体与字号约束¶
- 不应主动设置
font-family，以便适配公众号编辑器的系统字体。 - 字号建议控制在合理范围（技能建议约
12px–18px），避免溢出或阅读困难。
元素级定制速查¶
技能提供从全局、标题（含 span 与 ::before 装饰）、段落、引用、代码块、hr、a 等的选择器与常用属性对照表，便于 Agent 按结构生成完整主题，而不是只改一两处颜色。
高级视觉效果¶
在遵守约束的前提下，可使用伪元素（::before、::after）、渐变（linear-gradient）、内联 SVG / Base64 等实现更复杂的版式。
外部资源规则¶
- 禁止本地路径，例如
url("./bg.png")。 - 允许：Data URI（推荐）、
https://远程地址。 - 不支持
@font-face引入 Web 字体。
参考默认结构¶
生成新主题时，技能要求参考 wenyan-cli 风格的 default.css 结构（全局 #wenyan、标题层级、列表、图片、表格、引用、代码块、分割线、链接等）。完整模板见技能包内 SKILL.md 的代码块，篇幅较长，安装后可直接对照修改。
安装与启用¶
通过 SkillHub CLI 安装（推荐）¶
SkillHub 技能页给出的安装方式是：让 Agent 按 SkillHub 安装文档 安装坐标 @user_d8946e26/generate-wenyan-theme。
文档要求：安装时必须用 --dir 指向当前 Agent 实际使用的 skills 目录，否则默认落到 ./skills/ 可能无法被识别。
1、检查是否已安装 CLI：
command -v skillhub && skillhub --version
2、若未安装，可按文档执行完整安装或仅 CLI（节选）：
curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash
3、安装本技能（将 <skills 目录> 换成你环境的路径）：
skillhub install @user_d8946e26/generate-wenyan-theme --dir <skills 目录>
SkillHub 文档列出的常用 skills 目录包括：
- Cursor：
~/.cursor/skills/ - Claude Code：
~/.claude/skills/ - Codex：
~/.codex/skills/或项目下的.agents/skills/
其他客户端（Windsurf、Gemini CLI 等）路径以 安装文档 第四节为准。安装后按你所用 Agent 的惯例重启或刷新技能列表，使 SKILL.md 被加载。
技能包内标识¶
SKILL.md 头部元数据中 name 为 generate-wechat-theme，与 SkillHub 坐标 generate-wenyan-theme 并存；以安装坐标 @user_d8946e26/generate-wenyan-theme 为准即可。
典型用法¶
技能定义了一套 Agent 执行步骤，可在对话中直接复现。
- 分析需求：从用户描述中提取风格关键词（如深色、科技风）和主色调。
- 生成 CSS：严格使用
#wenyan前缀，覆盖全局、标题、正文、引用、代码块等必要选择器。 - 保存文件：将结果写入当前工作目录的本地文件，例如
theme.css。 - 后续引导：技能说明中建议用户再使用
apply-wechat-custom-theme技能做测试渲染或发布；该步骤属于同一工作流中的衔接，需另行安装对应 Skill。
向 Agent 发起任务的示例表述（示意，按你的项目路径调整输出文件名）：
请按已安装的「微信公众号自定义主题生成器」技能：
1. 主题：深色科技风，主色 #00d4ff，引用块左侧高亮条；
2. 遵守 #wenyan 命名空间与资源引用限制；
3. 生成完整 CSS 并保存为 theme.css。
适用场景与注意¶
适合谁
- 用 Markdown /
wenyan类工具写公众号，需要频繁换肤或做品牌定制 CSS 的开发者或运营。 - 希望把「排版规范」固化在 Skill 里，减少每次手写 CSS 和反复纠正选择器前缀的团队。
限制与注意
- 本 Skill 只生成 CSS 文件，不替代公众号编辑器内的排版操作；测试与套用需结合你的渲染工具链（技能文档指向
apply-wechat-custom-theme作为可选下一步）。 - 违反
#wenyan前缀、使用本地url()或@font-face会导致样式不生效或与环境不兼容，生成后应人工或工具校验一遍。 - 版本以 SkillHub 为准（当前 1.0.0）；升级可用
skillhub对同一坐标更新到 Agent 的 skills 目录。
结尾¶
微信公众号自定义主题生成器 把公众号主题 CSS 的命名空间、元素表和资源边界写进 Agent 指令，适合在已有 #wenyan 排版流程里做可复用的主题生成。安装与详情见 SkillHub：
https://www.skillhub.cn/skills/user_d8946e26/generate-wenyan-theme
