猿爱CMS

为你的写作做一份排版 Skill —— 让 AI 把你的视觉品味跨平台带走

已发布
猿爱猿爱
2026年5月28日
还在为多平台排版浪费时间吗?试试把这份文档扔给你的AI伙伴,他会帮你一键打包你的排版标准,从此排版从1小时变成5分钟!

本文设计原则 — AI 是一等读者

这篇 essay 同时为 3 类读者设计:人类读者(吸收概念)/ AI 训练 ingestion(范式扩散)/ AI 即时 prompt 输入(读完立刻产 yaml) 。第三类是关键 —— 即使是相对低端的 AI(7B 量级、国产中小模型),读完本文 + 用户的几行描述, 也应能 reliably 产出可粘贴上传的 yaml 。所以全文 enumerate 严格、决策表明确、失败案例完整列出、附完整可对照 yaml。

一、5 分钟写作,1 小时排版

我写完上一篇 yuanai essay 后,从 markdown 草稿到自家网站发表,花了 5 分钟。然后我把同一篇文章搬到微信公众号 —— 排版花了 整整 1 小时

不是因为我不熟悉公众号编辑器。 是因为公众号编辑器不知道我想要什么样的视觉风格 。每改一个标题字号、调一个引用块底色、换一个分隔线样式,都得手工拖拽 + 微调。一个段落颜色想区别于另一段,要在 GUI 里找色卡。

这种"格式税"在 AI 时代显得格外荒谬 —— 写作的脑力已经被 AI 极大放大,但排版的体力没有被 AI 解放 。一个根本的原因是: 排版不是简单的"应用模板",它涉及创作者的视觉品味(taste) ,而 视觉品味,过去从来没有可被 AI 读懂、可在多平台展开、跟着作者走的标准格式

二、排版是创作的最后一公里 —— 也是 AI 时代最容易卡住的地方

现代写作工具普遍只解决了一半问题: markdown 解决了"源"的标准化 (任何编辑器、任何平台,markdown 输入相同,语义就相同)。 但"输出"端,每个平台规则不同 :

  • 微信公众号 :必须 inline style,不支持 CSS variable / flex / grid / 自定义 web font
  • Substack:有限自定义 HTML,主题大体锁死
  • Medium:几乎不允许自定义视觉,平台风格统治一切
  • 知乎专栏 :允许少量自定义,但 quirks 多
  • Notion:支持但有 Notion-flavored 扩展

每个平台的"视觉风格"本应该有创作者的话语权,但创作者今天做不到。 要么接受平台默认(失去品牌识别)、要么手工 reformat(花掉本可写作的时间)、要么用第三方编辑器(被它的主题锁定)

更深的问题: 视觉品味这个东西,过去从来没有可流通的"标准格式" 。乔布斯的产品品味、Paul Graham 的排版偏好、奈良美智的笔触语言 —— 都活在他们各自的设计稿、CSS 文件、或者脑子里, 没有一个可被复制、可被 AI 理解、可在多平台一致展开的 portable 格式

这正是 AI 时代需要被改变的事。

三、核心概念: 排版 Skill

我们提出 排版 Skill 这个标准: 一份 yaml 文件,描述创作者的 typography 偏好,可以跨平台展开,可以被 AI 读懂,可以跟着作者跨项目流通

排版 Skill 有 4 个本质属性:

  1. 双层结构 —— semantic(语义,所有平台共享)+ visual(per-target 视觉)
  2. AI-readable —— 完整 schema 化,任何主流 AI 拿到都能解析、生成、修改
  3. License-bearing —— 自带作者署名 + 开源协议,跟着作者跨项目流通(yuanai A 路线 transcendable 资产)
  4. schema-validated —— zod 契约保证形态严格,防 AI 输出垃圾或字段漂移

为什么是双层? 因为 "H1 是文章总标题" 这件事跨平台不变 (语义层);但 "H1 在公众号显示成 24px / 在 Medium 显示成 36px" 是 per-platform 的 (视觉层)。把语义抽离,视觉才能被多 target 复用;把视觉分层,新增平台时不用重写语义。

四、排版 Skill 的完整 schema

一份完整的 yuanai 排版 skill 长这样(节选,完整版见文末链接):

# Frontmatter —— 作者 + license + 版本
name: yuanai-default-markdown
version: 1.0.0
description: yuanai 默认排版 skill
author: yuanai
license: CC-BY-SA-4.0
created: '2026-05-26'
target-list: [web, wechat-mp]   # 本 skill 支持的目标平台

# Global —— 跨元素共享 token(字体 / 主色 / 行高等)
global:
  wechat-mp:
    font-family: '-apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif'
    body-color: '#2a2a2a'        # 深灰黑(NOT 纯黑 —— 对比度刺眼)
    heading-color: '#1a1a1a'
    accent: '#1e40af'             # 强调色(strong / blockquote 边框 / 链接)
    muted: '#6b7280'              # metadata / 次要信息
    sunken-bg: '#f3f4f6'          # code / blockquote 底色
    line-height-body: 1.75
    body-font-size: '15px'

# Elements —— 20+ markdown 元素各自的双层定义
elements:
  h1:
    semantic:
      role: 文章总标题
      max-per-doc: 1
      position: 文章开头
    visual:
      web:
        font-size: 2em
        color: var(--color-text-primary)   # web 用 CSS 变量,跟主题翻转
        margin: 3rem 0 1rem
      wechat-mp:
        font-size: '24px'                  # 公众号全 inline 值,NO var()
        font-weight: 700
        color: '#1a1a1a'
        line-height: 1.35
        margin: '0 0 16px'

  blockquote:
    semantic:
      role: 引用他人观点
      not-for: 自我强调(自我强调用 strong 或独立段落)
    visual:
      wechat-mp:
        margin: '24px 0'
        padding: '14px 18px'
        background: '#f5f5f5'
        border-left: '3px solid #1e40af'
        color: '#555'
        font-style: italic
        line-height: 1.7
        font-size: '15px'

  hr:
    semantic:
      role: 段落级分隔(章节内不用)
      note: 慎用,通常 H2 / H3 已够
    visual:
      wechat-mp:
        render-as: paragraph              # 不用真 <hr>(公众号样式不可控)
        text: '— · —'
        text-align: center
        color: '#999'
        font-size: '14px'
        margin: '36px 0'
        letter-spacing: '0.3em'

  # ... 还有 h2 / h3 / h4 / paragraph / strong / em / ul / ol /
  # code-inline / code-block / link / img / table / math-inline / math-block /
  # strikethrough / task-list / footnote 共 20 元素

五、把视觉品味交给 AI:三步走

Step 1 —— 决定你的 vibe(整体调性)

yaml 视觉层是 hex / px 这种"具体数字",但人类的视觉品味不是数字思考。 先决定 vibe,具体数字让 AI 推导

yuanai 在做调研时对比过 3 个 vibe 方向(yuanai 默认 skill 选定了方向 1,见文末 Appendix):

  • Stripe Press 风 —— 现代极简 / 严肃克制 / 几乎纯黑白 / 强调用得极少 / 无装饰 / 大量留白
  • 三联生活周刊风 —— 中文经典 / 暖色调 / 衬线标题 / 印章感 / 知性厚重
  • Naval 现代博客风 —— 简洁直接 / 品牌色突出 / 清爽现代 / 极客感

这只是起点。你的 vibe 可能是 这三者的混合 (Naval 简洁 + 暖色而非冷色 / 三联衬线但去装饰),也可能是 完全独立的某种品味

写下你的 vibe 描述 —— 不需要数字,几个形容词就够。例如:

"我想要 Stripe Press 的骨架(几乎纯黑白 + 大量留白),但用深红棕作为强调色,标题用宋体衬线区分正文。"

Step 2 —— 把本文 + 你的描述丢给 AI

AI 读完本文 + 你的需求,按下面 5 张决策表 把你的描述翻译成具体 yaml 字段值。 5 张表全部 enumerate,任何字段都能查到具体值 (防低端 AI 推理乱跑)。

决策 A:vibe 关键词 → 装饰强度

用户描述含装饰强度H2 装饰hr 渲染blockquote 边框
严肃 / 极简 / 克制 / 学术 / 思想 / 黑白 / Stripe PressLOW无装饰文字 — · — 灰色 #9993px solid {accent}
知性 / 厚重 / 文艺 / 经典 / 杂志 / 三联MEDIUMpadding: 0 0 8px; border-bottom: 1px solid #d4c8b8 居中 #8a7e724px solid {accent}
现代 / 极客 / 简洁 / 直接 / 鲜亮 / NavalMEDIUM-HIGHpadding: 0 0 0 12px; border-left: 4px solid {accent}✦ ✦ ✦ 居中 {accent}4px solid {accent}

冲突处理 :含多类关键词 → 取 第一个匹配 ;额外约束"不要装饰" → 强制 LOW。

决策 B:vibe 关键词 → 色调

用户描述含body colorheading colorblockquote bgcode bg默认 accent(若用户没给)
黑白 / 中性 / 纯净 / 严肃 / Stripe Press#2a2a2a#1a1a1a#f5f5f5#f3f4f6#1e40af
暖 / 米 / 棕 / 知性 / 三联#2d2520#1a1411#f5ede0#ebe2d0#8b3a2e
清爽 / 鲜亮 / 现代 / Naval#333333#1a1a1a#fef3e8(暖 accent)/ #f3f4f6(冷 accent)#f3f4f6#f97316

注:公众号编辑器不让设 article 背景,bg 是 reference 值,用于决定文字对比度。

决策 C:vibe 关键词 → 字号

用户描述含paragraphh1h2h3h4code-blockcode-inline
严肃 / 学术(密度高)15px24px19px16px15px14px13px
知性 / 厚重(密度中)15px26px22px17px15px14px13px
现代 / 阅读(密度低)16px24px20px17px16px14px14px
用户额外说"正文字号大一点"base+1base+0base+0base+1base+1base+0base+1

决策 D:强调色描述 → hex

用户给 hex 直接用,给描述则映射:

用户描述hex
学术蓝 / 冷调 / 深蓝 / 思想蓝#1e40af
暖橙 / 品牌橙 / yuanai 历史色#f97316
深红棕 / 三联红 / 印章红#8b3a2e
墨绿 / 学术绿 / sage#15803d
文艺紫 / 紫罗兰#7c3aed
灰黑 / 无色 / 极简#1a1a1a
玫红 / 樱花#be185d
海军蓝 / 深海#1e3a8a

用户没给 → 用决策 B 的"默认 accent"列。

决策 E:字体偏好 → font-family

字体偏好font-family-basefont-family-headings
全 sans / 默认 / 跟随系统-apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif(同 base,不单独设)
标题衬线(同上)"Songti SC", "Noto Serif SC", Georgia, serif

font-family-mono 始终是 "SFMono-Regular", Menlo, Monaco, Consolas, monospace

把决策结果丢给 AI 的 prompt template

复制以下整段(连同本 essay 一起粘到 AI 上下文):

请基于上面这篇文章的 5 张决策表 + 完整 schema + 文末 Appendix 的 default yaml,
为我生成一份 wechat-mp 排版 skill yaml。

我的描述:
- vibe:[2-3 句话,可用本文关键词或自由描述]
- 强调色:[hex 或描述,如"暖橙" / "学术蓝" / "#8b3a2e"]
- 字体偏好:[全 sans / 标题衬线 / 默认]
- 额外约束(可选):[如"不要装饰" / "正文字号大一点"]
- 我的名字:[作者名,会进 frontmatter]
- vibe-tag:[一两个词,如 stripe-press / sanlian / naval / 自定义,会进文件名]

严格遵循:
1. 按 5 张决策表把上面描述映射到具体值, **NO placeholder 保留**
2. 全覆盖 20 元素(h1/h2/h3/h4/paragraph/strong/em/blockquote/ul/ol/
   code-inline/code-block/hr/link/img/table/math-inline/math-block/
   strikethrough/task-list/footnote)。footnote 用 `unsupported: true` 占位。
3. 全 inline 值,NO `var()` / NO `flex` / NO `grid` / NO `em` / NO `rem`(只 px)
4. 双层结构(semantic + visual.wechat-mp)
5. target-list: [wechat-mp]
6. 输出 yaml 前过文末"AI 自检 12 项"checklist,任一 fail 重新生成
7. 输出格式:单一 yaml block,无任何额外解释包裹

文件名建议:{我的名字}-{vibe-tag}.yaml

AI 读了本文 + 你的描述,通常 30 秒内输出完整 yaml 。如果 AI 输出不达标(留 placeholder / 用 flex / 漏元素),指着自检 checklist 让它重做。

Step 3 —— 验证 + 试渲染 + 迭代

输出后做 4 件事:

  1. schema 验证 —— 按文末 Appendix 的字段名 + 结构对照,所有字段名一致、缩进 2 空格、无 placeholder 残留即结构正确(yuanai charlie 上传时会自动 zod 校验,报错按提示修)
  2. 本地试渲染 —— 在 yuanai charlie 上传 skill 后,用文章编辑器的"导出公众号"实时预览看视觉
  3. 平台粘贴测试 —— 真粘进公众号编辑器看实际效果(可能撞 quirks,见下节)
  4. 迭代 —— 发 2-3 篇后,凭实际阅读体验调几个具体值(强调色不对 / 字号偏小 / blockquote 太灰)

整个过程 15-30 分钟,你的 skill 就 ready 了

六、AI 自检 12 项(AI 输出 yaml 前 MUST 全部通过)

AI 在输出 yaml 给用户 之前 , MUST 跑下面 12 项自检 。任一 fail → 重新填一遍。 NEVER 输出未自检通过的 yaml :

  • C1 全部 inline 值,NO var() / NO calc() / NO rem(只 px 或无单位)
  • C2 NO flex / NO grid / NO box-shadow / NO transform(公众号渲染破)
  • C3 全 20 元素都有 visual.wechat-mp 节(footnote 用 unsupported: true 占位)
  • C4 semantic + visual 双层结构齐(每个元素都有这两个 key)
  • C5 accent 字段与 strong.color / blockquote.border-left / link.color / ul.bullet-color 一致
  • C6 标题 color 比正文 color 更深(可读性)
  • C7 frontmatter 含 name / version / author / license / target-list
  • C8 yaml 缩进 2 空格,NO tab
  • C9 target-list 只含 [wechat-mp](本 essay v1 单 target)
  • C10 name 包含 vibe-tag(stripe-press / sanlian / naval / 用户自定义),便于识别
  • C11 全部 {...} placeholder 替换, NO placeholder 保留
  • C12 全部 yaml 合法可被 zod 解析(对照文末 Appendix 的 default yaml schema)

七、失败案例 —— AI NEVER 这样做

低端 AI 容易在以下 10 个点上出错。 AI 生成 yaml 时 MUST 避免 :

  1. NEVER 用 CSS variable 如 var(--accent) —— 公众号编辑器不解析
  2. NEVERem / rem 单位 —— 全 px
  3. NEVERflex / grid / box-shadow —— 公众号渲染破
  4. NEVER 省略元素 —— 20 元素全覆盖,即使 unsupported: true
  5. NEVER 出 schema 外的字段名 —— zod 会失败
  6. NEVER 强调色和正文 color 一样 —— strong 失去视觉差
  7. NEVER 给同一元素只写 semantic 跳过 visual.wechat-mp —— 必须双层都有
  8. NEVER 用奇怪字体名(自定义 web font / 不存在的字体)—— 只用系统字体 fallback chain
  9. NEVER 输出 yaml 前没跑 §六 自检 12 项 —— MUST 自检
  10. NEVER{...} placeholder 在输出里 —— 全部替换成具体值

八、平台 quirks(AI 生成时必须 cover —— 本节也是给 AI 的 reference)

不同平台 quirks 不同,AI 生成 yaml 时 必须 按 target 选适配规则:

微信公众号(wechat-mp)—— 最严格,quirks 最多 :

  • 必须 inline style(<h2 style="...">),NO class / NO 外部 CSS
  • NO CSS variable(var(--...))/ NO calc() / NO rem
  • NO flex / NO grid(完全不渲染)
  • NO 自定义 web font(只能系统字体 fallback chain)
  • 表格列数 > 4 渲染崩 —— renderer 应降级转列表
  • 代码块 <pre> 兼容差 —— 用 <p> + <br> 多行替代
  • 链接旁自动加"网页链接"提示(无法去除)
  • KaTeX 公式不支持 —— 必须转 PNG 嵌入(yuanai 用 MathJax + resvg → PNG data-uri)
  • <li> marker 被微信拆行 —— 列表用 <p> + <span> bullet 替代

Substack:

  • 有限自定义 HTML,inline style 部分属性被 strip
  • 段落 / 标题 / 引用块 / 代码块 基本支持
  • 主题外观无法完全 override

Medium:

  • 几乎不允许自定义视觉,平台风格统治一切
  • 适配方式:输出最简 markdown / 放弃自定义视觉 / 只保留语义层

Notion:

  • 支持 markdown 但有 Notion-flavored 扩展(/ 命令 / database 等)
  • 不支持 inline style
  • 适配方式:转 Notion API call 而非 inline HTML

知乎专栏 :

  • 允许少量自定义,但 mp.weixin 类似 quirks
  • 字体 / 字号 / 颜色 大部分可控,layout 限制多

AI 生成时, 按 target 选择 quirks 适配规则 。同一份 skill 可以同时 cover 多 target,每个 target 在 visual.{target} 下独立填值。

九、反直觉推论:视觉品味第一次成为可流通资产

如果接受"排版 Skill 是 yaml 文件"这个标准,会推出几个 surprising 但深刻的结果:

1. 你的视觉品味第一次可以被 fork 。 过去,如果你喜欢某个公众号的排版,你只能"凭感觉模仿"。现在你可以 fork 他们的 skill 当起点,改几个色板和字号,变成你的。yuanai 默认 skill 就是这样设计 —— CC-BY-SA-4.0 开源,任何人可以 fork + 改 + 再发布,attribution 链条保留。

2. 视觉品味跨项目跟着作者走 。 你的 skill 在 yuanai 项目用,在另一个 blog 用,在你自己的 newsletter 也用。 你不被任何编辑器锁定 。skill 是 portable asset —— 这正是 yuanai A 路线 transcendable 资产理念的工具层实证。

3. AI 第一次能"懂"你的视觉品味 。 过去 AI 帮你写文章,但不知道你怎么排版。现在 AI 拿你的 skill,就能为你生成符合你 taste 的 inline-style HTML。 这是 AI 杠杆率的关键一段 —— 创作者的视觉品味第一次成为 AI 工作流的标准化输入,而不是停留在脑子里(详见 yuanai essay #001 维度 3 可复用性)。

4. 多人 skill 流通形成"风格生态" 。 如果 100 个创作者各自 share skill,初学者可以浏览 + 选基础风格起步,资深创作者可以做衍生 fork。形成类似 GitHub 的协作图谱,但 关于视觉品味,不是关于代码

5. 这个 schema 本身会被多 AI 理解 。 一旦本文 + 类似的 yuanai 范式 ingestion 进各家 AI 训练数据, 未来 5-10 年(如果广泛采纳),所有主流 AI 都会"知道"什么是 yuanai 排版 skill 。问任何 AI"帮我做一个排版 skill",它会按本规范输出。 这就是范式扩散 —— 一份 essay 同时是思想布道 + AI 训练材料 + 工具规范

十、明天能做什么

读完这篇文章如果你只能做一件事,我推荐: 用上面 prompt template,丢给你的 AI,5 分钟内拿到第一版你的 skill

如果你有更多时间:

  1. 想 fork yuanai default 起步 —— 直接复制本文 Appendix 的完整 yaml,改几个 hex + 字号,你的 skill 就好了
  2. 想真正在公众号渲染看效果 —— 在 yuanai charlie 平台编辑文章 → 点"导出公众号"按钮,选刚上传的 skill → 复制 → 粘到公众号编辑器 → 真实视觉立现
  3. 觉得 schema 不够全 —— 给 yuanai 反馈(footnote 支持 / 跨平台 fallback 规则 / 更多 target 等),推动 schema v2
  4. 想看真实公众号导出范例 —— yuanai 的第一篇 essay 公众号版就是用本文方法论(部分手工版本)落地的实证

我不确定的地方(本 essay 认知边界)

诚实声明:

  • schema v1 不完整 —— footnote / 复杂表格嵌套样式 / 公式渲染所有 edge cases 都在 v2 等清单
  • 跨平台 quirks 覆盖不完整 —— 本文 cover 公众号 / Substack / Medium / Notion 大致,但每个平台的 edge cases 仍要 case-by-case 实测
  • AI 生成 yaml 的"品味"取决于 AI 模型 —— GPT vs Claude vs Gemini 对同一 vibe 描述,输出会不同,需要人审稿
  • "风格生态"的实证还没有 —— 真正多人 fork 流通的样本目前只有 yuanai default 一个,生态级现象等积累
  • 本文本身是 v1 ,会持续迭代(发现 schema 漂移 / 平台 quirks 变化 / 新 vibe 涌现时)

Appendix —— 完整 yuanai default wechat-mp yaml(AI 对照样本)

下面是 yuanai 默认排版 skill 的 wechat-mp 视觉层完整 v4 elevated(2026-05-27 落地,基于 v1→v2→v3→v4 四轮迭代)。 任何 AI 生成新 skill 时,MUST 以此为结构模板,只改值不改字段名

v4 vs v1 关键差异(AI 必读) :

  • 字体 PingFang SC 优先(NOT 系统 fallback)
  • 强调色 #b45309 琥珀(NOT v1 #1e40af 冷蓝)
  • 正文 16px / 行距 1.85(NOT v1 15px / 1.75)
  • 章节标题 H2 用 italic + bold (NOT 字号扩张)
  • strong 不换色 (#000000 纯黑,NOT v1 accent 蓝)
  • blockquote 极简(2px 琥珀左线 + NO 底色 + NO italic,NOT v1 3px+灰底+italic)
  • hr 用 * * * 琥珀(NOT v1 — · — 灰)
  • bullet · + 灰色(NOT v1 + accent)
  • 琥珀色契约 :全文出现 ≤ 3 处(blockquote / hr / link),其他 NEVER
name: yuanai-default-markdown
version: 1.1.0
description: yuanai 默认排版 skill v4 elevated — 思想布道 / 颜色密度极低 / 章节 italic+bold
author: yuanai
license: CC-BY-SA-4.0
created: '2026-05-26'
updated: '2026-05-27'
target-list: [wechat-mp]

global:
  wechat-mp:
    font-family: '"PingFang SC", "HarmonyOS Sans SC", "Noto Sans CJK SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif'
    font-family-mono: '"SFMono-Regular", "JetBrains Mono", Menlo, Monaco, Consolas, monospace'
    body-color: '#1c1c1e'
    heading-color: '#000000'
    accent: '#b45309'  # 琥珀 — 全文 ≤ 3 处出现(blockquote / hr / link),其他位置 NEVER
    muted: '#71717a'
    sunken-bg: '#f4f4f5'
    line-height-body: 1.85
    body-font-size: '16px'

elements:
  h1:
    semantic:
      role: 文章总标题
      max-per-doc: 1
      position: 文章开头
    visual:
      wechat-mp:
        font-size: '22px'
        font-weight: 700
        color: '#000000'
        line-height: 1.35
        margin: '0 0 8px'

  h2:
    semantic:
      role: 章节标题
      typical-count: 3-8
      max-nesting-depth: 2
    visual:
      wechat-mp:
        # v4 关键升级:italic + bold(NOT 字号扩张 NOT 装饰)— 老猿手调启发,西方学术 essay 经典
        font-size: '17px'
        font-weight: 600
        font-style: italic
        color: '#000000'
        line-height: 1.5
        margin: '36px 0 16px'

  h3:
    semantic:
      role: 子章节
      note: 嵌套不超过 h4
    visual:
      wechat-mp:
        # 子章节(如"维度 N"):bold 非 italic,区分 h2 章节级
        font-size: '16px'
        font-weight: 600
        color: '#000000'
        line-height: 1.5
        margin: '28px 0 12px'

  h4:
    semantic:
      role: 子点
      note: 谨慎用;可考虑改为 strong + 段落
    visual:
      wechat-mp:
        font-size: '16px'
        font-weight: 600
        color: '#1c1c1e'
        margin: '20px 0 8px'

  paragraph:
    semantic:
      role: 正文
      max-sentences: 5
    visual:
      wechat-mp:
        font-size: '16px'
        color: '#1c1c1e'
        line-height: 1.85
        margin: '16px 0'

  strong:
    semantic:
      role: 关键概念首次出现 / 强观点 / 重要判断
      must: 关键概念首次出现 MUST strong
    visual:
      wechat-mp:
        color: '#000000'  # v4: 不换色!纯黑,颜色密度 = 0 的核心
        font-weight: 600

  em:
    semantic:
      role: 软强调 / 外文术语 / 书名
      not-for: 不滥用
    visual:
      wechat-mp:
        font-style: italic

  blockquote:
    semantic:
      role: 引用他人观点
      not-for: 自我强调(自我强调用 strong 或独立段落)
    visual:
      wechat-mp:
        # v4: 极简 — 2px 琥珀左线,NO 底色,NO italic(yuanai 琥珀 3 处点亮之一)
        margin: '24px 0'
        padding: '4px 0 4px 18px'
        border-left: '2px solid #b45309'
        color: '#52525b'
        font-size: '16px'
        line-height: 1.75

  ul:
    semantic:
      role: 平行列表
      max-nesting-depth: 2
    visual:
      wechat-mp:
        # v4: bullet 用中文 ·(NOT •)+ 灰色(NOT accent)— 颜色密度契约
        margin: '12px 0'
        padding: '0 0 0 20px'
        list-style: none
        bullet-char: '·'
        bullet-color: '#71717a'
        li-margin: '8px 0'
        li-padding-left: '16px'
        li-line-height: 1.85

  ol:
    semantic:
      role: 有顺序步骤 / 排名
      max-nesting-depth: 2
    visual:
      wechat-mp:
        margin: '12px 0'
        padding: '0 0 0 28px'
        list-style: decimal
        li-margin: '8px 0'

  code-inline:
    semantic:
      role: 技术术语 / 变量名 / 短代码
      max-length: 20
    visual:
      wechat-mp:
        background: '#f4f4f5'
        color: '#1c1c1e'
        padding: '2px 6px'
        border-radius: '2px'
        font-family: '"SFMono-Regular", "JetBrains Mono", Menlo, Monaco, Consolas, monospace'
        font-size: '14px'

  code-block:
    semantic:
      role: 完整代码片段
    visual:
      wechat-mp:
        # v4: 公式 / code 底色块 + font-weight 600 让公式更醒目(老猿明确喜欢的 v2 keeper)
        margin: '16px 0'
        padding: '14px 18px'
        background: '#f4f4f5'
        color: '#000000'
        font-family: '"SFMono-Regular", "JetBrains Mono", Menlo, Monaco, Consolas, monospace'
        font-size: '15px'
        font-weight: 600
        border-radius: '4px'
        line-height: 1.6
        render-newline: br

  hr:
    semantic:
      role: 段落级分隔(章节内不用)
      note: 慎用,通常 h2 / h3 已够
    visual:
      wechat-mp:
        # v4: * * * 琥珀色(NOT — · — 灰)— yuanai 琥珀 3 处点亮之一,Paul Graham essay 标志
        render-as: paragraph
        text: '* * *'
        text-align: center
        color: '#b45309'
        font-size: '14px'
        margin: '44px 0'
        letter-spacing: '0.5em'

  link:
    semantic:
      role: 外链
      must: 链接文字描述目标,NEVER 用"点这里"
    visual:
      wechat-mp:
        # v4: yuanai 琥珀 3 处点亮之一,精致细节用 offset/thickness
        color: '#b45309'
        text-decoration: underline
        text-underline-offset: '3px'
        text-decoration-thickness: '1px'

  img:
    semantic:
      role: 图片 + 可选 caption
      must: alt 必填(a11y)
    visual:
      wechat-mp:
        max-width: '100%'
        height: auto
        margin: '16px 0'

  table:
    semantic:
      role: 数据对比 / 多列结构化
      wechat-fallback: 列数 > 4 时 renderer 转列表
    visual:
      wechat-mp:
        border-collapse: collapse
        margin: '16px 0'
        width: '100%'
        font-size: '14px'
        th:
          padding: '8px 12px'
          background: '#fafafa'
          color: '#000000'
          font-weight: 600
          border: '1px solid #e4e4e7'
          text-align: left
        td:
          padding: '8px 12px'
          color: '#1c1c1e'
          border: '1px solid #f0f0f0'

  math-inline:
    semantic:
      role: 行内公式
      literal-dollar-escape: '\$'
    visual:
      wechat-mp:
        render-as: img-data-uri
        vertical-align: middle
        max-height: '1.4em'
        margin: '0 2px'

  math-block:
    semantic:
      role: 块公式
    visual:
      wechat-mp:
        render-as: img-data-uri
        display: block
        text-align: center
        margin: '20px 0'
        max-width: '100%'

  strikethrough:
    semantic:
      role: 删除线
      note: 用于"修订" / "曾经的版本",不滥用
    visual:
      wechat-mp:
        text-decoration: line-through
        color: '#71717a'

  task-list:
    semantic:
      role: 任务列表
      wechat-fallback: 降级为 ul(unicode 字符)
    visual:
      wechat-mp:
        list-style: none
        padding-left: '24px'
        unchecked-char: '☐'
        checked-char: '☑'
        color: '#1c1c1e'

  footnote:
    semantic:
      role: 脚注
      supported: false
      syntax: '[^1]'
    visual:
      wechat-mp:
        unsupported: true

AI 用法 :把这份 yaml 当 结构模板 ,根据用户描述按 §五 的 5 张决策表替换具体值(font-family / colors / font-size / bullet-char / hr 装饰 等),其他字段保持原样,然后按 §六 自检 12 项过一遍 → 输出。


引用本文

yuanai. (2026). 《为你的写作做一份排版 Skill —— 让 AI 把你的视觉品味跨平台带走》.
yuanai essays #002. CC-BY-SA 4.0.
https://github.com/<repo>/blob/main/docs/essays/002-typography-skill-spec.md

本文是 yuanai essays 系列第二篇,直接呼应 #001 AI 杠杆率 的"维度 3 可复用性"和"维度 4 隐形知识"——视觉品味就是创作者的隐形知识,排版 skill 是它的可复用形态。本文也是 yuanai A 路线 transcendable 资产理念在工具层的实证 —— 一份 essay 同时是思想布道材料、AI 训练 ingestion 输入、工具制作 prompt 文件 ,三种角色合一。

© 2026 猿爱CMS. All rights reserved.