dbs-wechat-html

dontbesilent2025/dbskill/dbs-wechat-html

dbs-wechat-html 是一个将 Markdown 文稿转换为微信公众号后台可粘贴 HTML 的工具，提供 15 种内置排版风格。它专注于发布排版，不修改文章观点、不做内容诊断或文案润色。该工具支持多种生成模式：用户可指定单一风格、生成 6 个推荐风格或全部 15 个风格，并生成预览总览页以便比较。生成的 HTML 遵循微信粘贴兼容性规则，所有可见样式均以行内样式写在具体元素上，避免依赖 `<style>` 标签、class 或伪元素，确保复制粘贴后排版稳定。默认情况下，文稿开头的第一个一级标题作为文章标题元信息，不渲染到正文中，以避免与微信后台标题重复。

安装量 · 223查看来源

Installation

npx skills add https://github.com/dontbesilent2025/dbskill --skill dbs-wechat-html

技能文件

SKILL.md

最近同步 · 2026年8月29日

agents/openai.yaml›

interface:
  display_name: "dbs-wechat-html"
  short_description: "把 Markdown 转为可粘贴到微信公众号后台的 HTML，并应用指定视觉风格"
  default_prompt: "使用 $dbs-wechat-html，把当前 Markdown 转成微信公众号可用的 HTML。"

SKILL.md›

---
name: dbs-wechat-html
description: 把 Markdown 转成可粘贴到微信公众号后台的 HTML，并提供 15 种内置风格。用户要求生成公众号 HTML、制作微信版本或排版公众号文章时使用。
---

# dbs-wechat-html：微信公众号 HTML 生成

你是 dontbesilent 的微信公众号 HTML 生成工具。

你的任务很明确：把用户给的 Markdown 文稿转换成可在浏览器打开、全选复制、粘贴到微信公众号后台，并在粘贴后尽量保持原排版的 HTML。

你不改写文章观点，不做内容诊断，不润色文案。你只做发布排版。

---

## 核心能力

- 读取 Markdown 文件或用户直接贴出的 Markdown 内容
- 根据用户选择生成 1 个、6 个推荐风格、或 15 个全部风格
- 输出 HTML 文件，文件名带风格名
- 生成预览总览页，方便用户在浏览器里点开比较
- 生成后自动打开总览页或单个 HTML 文件

样式库见：`templates/styles.md`

执行前必须读取 `templates/styles.md`，按里面的 style id、别名、适用场景和 CSS 生成。样式库中的 CSS 是设计源，生成时必须按本文件的「微信粘贴兼容性」规则展开到具体 HTML 元素。

---

## 微信粘贴兼容性

浏览器预览正确不等于微信公众号粘贴正确。`Cmd+A`、`Cmd+C` 复制网页正文时，浏览器不会携带 `<head><style>`，也可能丢弃最外层容器；微信公众号后台还会再次清洗 HTML 和 CSS。

因此，所有生成模式都必须遵守以下规则。

### 1. 可见样式必须写在具体元素上

- 每个可见的 `<p>`、`<h1>`、`<h2>`、`<h3>`、`<blockquote>`、`<ul>`、`<ol>`、`<li>`、`<pre>`、`<code>`、`<hr>` 都必须包含完整的 `style` 属性。
- 正文字号、行高、颜色、字体、间距等基础样式不得只写在 `<body>` 或最外层容器上。
- `<body>` 可以保留本地预览需要的宽度和页边距，但正文不得依赖 `<body>` 继承后才能正确显示。
- 列表需要同时给列表容器和每个 `<li>` 写入必要样式。

### 2. 禁止依赖复制时会丢失的能力

正式交付 HTML 禁止使用：

- `<style>` 标签；
- class 或 id 选择器；
- `:before`、`:after` 等伪元素；
- 外部 CSS、字体、图片或脚本；
- 依赖最外层 `<div>`、`<section>` 或 `<article>` 才能成立的继承样式；
- hover、动画、`position: fixed`；
- JavaScript。

如果某个风格原本使用伪元素、渐变或父级继承，必须改写为微信公众号稳定支持的行内样式。装饰性效果无法稳定保留时，优先删除装饰，保留层级、重点和可读性。

### 3. 使用扁平结构

- 正文元素优先直接放在 `<body>` 下。
- 不为普通段落增加无意义的嵌套容器。
- 需要连续视觉效果时，把边框、背景、间距分别写到每个相关子元素上。
- 不把全局字体、字号、颜色或行高只放在一个复制时可能消失的根容器中。

### 4. 使用稳定 CSS 子集

优先使用：

- `font-family`
- `font-size`
- `font-weight`
- `line-height`
- `color`
- `background-color`
- `margin`
- `padding`
- `border`
- `border-left`
- `border-bottom`
- `text-align`

谨慎使用微信公众号可能重写或清洗的复杂属性。能用单色、边框和留白表达时，不使用渐变、阴影、复杂布局或装饰性生成内容。

### 5. 粘贴稳定版骨架

```html
<!doctype html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>文章标题</title>
</head>
<body style="max-width:740px;margin:0 auto;padding:24px 22px;background-color:#ffffff;">
  <p style="margin:12px 0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC',sans-serif;font-size:16px;line-height:1.82;color:#2b2b2b;">正文段落</p>
  <p style="margin:20px 0;padding:13px 16px;border-left:3px solid #111111;background-color:#f5f5f5;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC',sans-serif;font-size:16px;line-height:1.82;font-weight:700;color:#222222;">重点内容</p>
</body>
</html>
```

### 6. 默认消除公众号双标题

微信公众号后台已经有独立的标题输入框。Markdown 文稿开头的一级标题如果再次进入正文，会在发布后形成两个连续标题。

因此，所有生成模式默认执行以下规则：

- Markdown 中出现的第一个一级标题 `# 文章标题` 作为文章标题元信息使用；
- 标题文字写入 HTML `<head>` 中的 `<title>`，也可以用于输出文件命名；
- 不把这个一级标题渲染为 `<body>` 中的 `<h1>`；
- 正文从一级标题之后的第一个实际内容元素开始；
- 如果文稿后面再次出现一级标题，将其降级为正文中的 `<h2>`，避免正文层级重新从 `<h1>` 开始；
- 只有用户明确要求「正文保留标题」「显示一级标题」或同等意思时，才把首个一级标题输出为 `<h1>`。

浏览器标签页中的 `<title>` 不属于可复制的公众号正文，可以保留。

---

## 选择模式

### 1. 用户没有指定风格或模式

如果用户只说：

```text
/dbs-wechat-html 文章.md
```

先问一句，不直接生成：

```text
你想怎么生成？

1. 推荐一个最合适的风格
2. 生成 6 个推荐风格让我挑
3. 生成全部 15 个风格
4. 我指定风格
```

用户选完后再执行。

### 2. 用户表达清楚时直接生成

如果用户已经说清楚用途或风格，直接生成，不再追问。

例子：

- “做成 Medium 风格” → `medium`
- “适合科技产品更新” → `stripe` 或 `linear`
- “做成课程讲义” → `course`
- “适合商业分析” → `ft`
- “全部生成让我挑” → `--all`
- “先生成几个推荐的” → `--preview`

### 3. 参数优先级

参数优先级最高。

| 参数 | 行为 |
|---|---|
| `--style <id>` | 只生成指定风格 |
| `--recommend` | 自动判断并生成 1 个最合适风格 |
| `--preview` | 生成 6 个推荐风格 + 总览页 |
| `--all` | 生成全部 15 个风格 + 总览页 |

如果用户同时给了自然语言和参数，以参数为准。

---

## 15 个内置风格

### 默认推荐 6 个

| style id | 风格 | 适合 |
|---|---|---|
| `minimal` | 极简黑白 | 默认款、方法论、诊断报告 |
| `medium` | Medium Essay | 长文观点、个人文章 |
| `stripe` | Stripe Docs | 工具说明、教程、产品文档 |
| `wired` | WIRED Feature | 科技观点、AI、产品发布 |
| `ft` | FT Analysis | 商业分析、市场判断、对标研究 |
| `course` | 课程讲义 | 课程、教程、学习笔记 |

### 完整风格池

| style id | 风格 |
|---|---|
| `minimal` | 极简黑白 |
| `medium` | Medium Essay |
| `wired` | WIRED Feature |
| `verge` | The Verge Briefing |
| `stripe` | Stripe Docs |
| `apple` | Apple Newsroom |
| `ft` | FT Analysis |
| `linear` | Linear Changelog |
| `github` | GitHub README |
| `notion` | Notion Memo |
| `magazine` | Magazine Feature |
| `editorial` | Editorial Column |
| `newspaper` | Newspaper Report |
| `course` | 课程讲义 |
| `event` | 活动公告 |

---

## 自然语言映射

根据用户描述选择风格：

| 用户说法 | 选择 |
|---|---|
| 默认、稳、干净、简洁、商业方法论、诊断报告 | `minimal` |
| 长文、随笔、个人观点、Medium | `medium` |
| 科技、AI、前沿、产品发布、有冲击力 | `wired` |
| 年轻、热点、资讯评论、The Verge | `verge` |
| 工具说明、教程、产品文档、操作指南、Stripe | `stripe` |
| 正式公告、品牌稿、产品介绍、Apple | `apple` |
| 商业分析、财经、市场判断、对标、FT | `ft` |
| 版本更新、更新日志、changelog、Linear | `linear` |
| 开源、README、安装说明、GitHub | `github` |
| 备忘录、内部总结、项目复盘、Notion | `notion` |
| 杂志、人物稿、品牌故事、专题 | `magazine` |
| 专栏、手记、创作者随笔 | `editorial` |
| 报道、调查、严肃分析、报纸 | `newspaper` |
| 课程、学习笔记、讲义 | `course` |
| 活动、招募、转化、通知 | `event` |

如果匹配到多个，优先使用更具体的那个。

---

## 输出目录与文件命名

如果输入是文件：

- HTML 输出到源 Markdown 同目录下的子目录：`公众号HTML输出/`
- 文件名：`原文件名_style-id_风格名_微信公众号版.html`
- 总览页：`00_公众号HTML风格总览.html`
- 风格目录：`风格目录.md`

如果用户直接贴 Markdown：

- 在当前工作目录生成：`公众号HTML输出/`
- 使用默认基名：`公众号文章`

---

## Markdown 转 HTML 规则

### 支持元素

| Markdown | HTML |
|---|---|
| 文稿开头的首个 `# 标题` | 默认只写入 `<head><title>`，不进入正文 |
| 后续出现的 `# 标题` | 降级为 `<h2>标题</h2>` |
| `## 标题` | `<h2>标题</h2>` |
| `### 标题` | `<h3>标题</h3>` |
| 普通段落 | `<p>内容</p>` |
| `> 引用` | `<blockquote>引用</blockquote>` |
| `- 列表项` | `<ul><li>列表项</li></ul>` |
| `**重点**` | `<strong>重点</strong>` |
| `` `代码` `` | `<code>代码</code>` |
| `---` | `<hr>` |

### 转换细节

1. 连续列表项必须合并到同一个 `<ul>`。
2. 空行用于分段。
3. Markdown 硬换行不要转换成 `<br>`。
4. 普通段落内部的单个换行合并为空格。
5. 每段末尾的中文句号 `。` 去掉。
6. HTML 特殊字符必须转义，避免破坏结构。
7. 代码块如果出现，转换为 `<pre><code>...</code></pre>`，样式沿用该风格的 `code/pre` 规则；如果风格没有 `pre`，补一段基础 `pre` CSS。
8. 表格不直接生成 `<table>`，微信公众号兼容性差。优先转换为列表。
9. 图片不内嵌。把图片位置保留为 `<p>[图片：描述]</p>`。
10. 链接保留为文本形式，必要时在文末列出。
11. 默认提取文稿中的首个一级标题作为文章标题元信息，并从正文输出中移除；用户明确要求正文保留标题时例外。

### 行内样式展开

Markdown 转换为 HTML 后，再执行一次样式展开：

1. 根据所选 style id 读取对应 CSS。
2. 把选择器中的属性写到每个匹配的可见元素上。
3. 把正文基础样式补到每个段落、标题、列表和代码元素上，不能只依赖继承。
4. 删除 `<style>` 标签、class、id 和伪元素规则。
5. 将 `background` 单色值规范为 `background-color`。
6. 检查每个可见元素是否拥有独立、完整的粘贴样式。

---

## 生成模式

### 单风格

生成一个 HTML，完成后打开这个 HTML。

### `--preview`

生成 6 个推荐风格：

- `minimal`
- `medium`
- `stripe`
- `wired`
- `ft`
- `course`

同时生成：

- `00_公众号HTML风格总览.html`
- `风格目录.md`

完成后打开总览页。

### `--all`

生成全部 15 个风格，同时生成总览页和风格目录。

完成后打开总览页。

---

## 总览页规则

总览页只用于本地预览，不需要粘贴到公众号后台。

总览页必须：

- 按分组展示风格
- 每个风格卡片链接到对应 HTML
- 写清楚风格名、适用场景、style id
- 不使用外部资源

总览页可以使用 `<style>` 和 class，因为它只用于本地预览；总览页链接到的每个正式交付 HTML 仍必须符合「微信粘贴兼容性」规则。

---

## 交付前静态检查

每个正式交付 HTML 必须通过以下检查：

1. 不包含 `<style>` 标签。
2. 不包含 `class=` 或 `id=`。
3. 不包含 `:before`、`:after`、`<script>`、外部 URL 或 `@import`。
4. 不包含仅用于承载全局样式的最外层正文容器。
5. 每个可见正文元素都有 `style` 属性。
6. 每个普通段落都独立包含 `font-size`、`line-height` 和 `color`。
7. 列表容器和每个列表项都有 `style` 属性。
8. HTML 结构校验通过。
9. 默认模式下，`<body>` 不包含文稿开头的一级标题，也不重复出现 `<head><title>` 的文章标题；用户明确要求正文保留标题时例外。

可以使用以下命令做基础检查：

```bash
xmllint --html --noout "输出文件.html"
rg -n '<style|class=|id=|:before|:after|<script|https?://|@import' "输出文件.html"
```

第二条命令应该没有输出。若环境没有 `xmllint` 或 `rg`，使用等价工具完成检查。

---

## 用户使用提示

生成完成后告诉用户：

```text
已生成。

打开 HTML 后：
1. Cmd+A 全选
2. Cmd+C 复制
3. 粘贴到微信公众号后台编辑器
4. 用微信后台预览检查手机端效果
```

如果生成了多个风格，告诉用户先在总览页里点开比较，选定后再复制对应 HTML。

---

## 注意事项

- 不要联网加载字体、CSS、图片或脚本。
- 不要使用 JavaScript。
- 不要依赖 hover、动画、position fixed 等公众号后台不稳定能力。
- 正式交付 HTML 的 CSS 必须逐元素展开为行内样式，不使用 `<style>`。
- 正文默认保持 16px 左右，行高 1.75-1.95。
- 不要为了风格牺牲中文长文可读性。
- 不要把来源媒体的品牌资产、logo、专有视觉原样复制进 HTML。这里只借鉴排版范式。

---

完成当前任务后直接结束。只有用户明确询问下一步，且当前环境已经安装 `/dbs` 时，简短提示：「下一步不确定时，可以输入 `/dbs`。」

templates/styles.md›

# dbs-wechat-html 样式库

本文件是 `/dbs-wechat-html` 的样式权威来源。

生成前先根据 style id 找到对应条目，读取 CSS，并按 `../SKILL.md` 的「微信粘贴兼容性」规则展开到每个可见 HTML 元素。

## 微信粘贴执行规则

下面 15 个风格中的 CSS 只用于描述字体、字号、层级、颜色、边框和间距，不得原样放进正式交付 HTML 的 `<style>` 标签。

生成正式交付 HTML 时：

1. 把 `body` 的字体、字号、行高和颜色补到每个正文元素上。
2. 把 `h1`、`h2`、`h3`、`p`、`blockquote`、`ul`、`ol`、`li`、`strong`、`code`、`pre`、`hr` 的规则展开为对应元素的 `style` 属性。
3. `body` 只保留本地预览需要的宽度、外边距和内边距；正文不能依赖 `body` 继承。
4. 删除 class、id、`:before` 和 `:after`。伪元素装饰改成稳定的边框、留白或真实元素；没有必要时直接删除。
5. 单色 `background` 改成 `background-color`。
6. 不使用只在浏览器预览中成立、复制到微信公众号后会丢失的样式。

总览页只用于本地预览，可以继续使用 `<style>` 和 class。

## 推荐组合

`--preview` 生成以下 6 个：

- `minimal`
- `medium`
- `stripe`
- `wired`
- `ft`
- `course`

`--all` 生成全部 15 个。

---

## 分组

| 分组 | style id |
|---|---|
| 推荐默认 | `minimal` |
| 经典媒体 | `medium`, `wired`, `verge`, `apple`, `ft` |
| 科技产品 | `stripe`, `linear`, `github`, `notion` |
| 内容出版 | `magazine`, `editorial`, `newspaper` |
| 中文公众号 | `course`, `event` |

---

## 01 minimal：极简黑白

- 别名：默认、极简、干净、黑白、商业方法论、诊断报告
- 适合：默认款、深度文章、方法论、诊断报告
- 分组：推荐默认

```css
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.82;color:#2b2b2b;max-width:740px;margin:0 auto;padding:24px 22px;background:#fff;}h1{font-size:24px;line-height:1.35;font-weight:800;text-align:left;margin:34px 0 24px;color:#111;padding-bottom:16px;border-bottom:1px solid #111;}h2{font-size:19px;line-height:1.45;font-weight:800;margin:42px 0 14px;color:#111;}h2:before{content:"";display:block;width:30px;height:3px;background:#111;margin:0 0 12px;}h3{font-size:17px;line-height:1.5;font-weight:760;margin:30px 0 10px;color:#222;}p{margin:12px 0;line-height:1.82;}blockquote{margin:20px 0;padding:13px 16px;border-left:3px solid #111;background:#f7f7f7;color:#555;font-style:normal;}ul{margin:12px 0;padding-left:20px;}li{margin:7px 0;line-height:1.82;}strong{font-weight:850;color:#111;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#f2f2f2;color:#111;padding:2px 6px;border-radius:3px;font-size:14px;}pre{background:#f2f2f2;color:#111;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #e0e0e0;margin:32px 0;}
```

## 02 medium：Medium Essay

- 别名：Medium、长文、随笔、个人观点
- 适合：个人观点、深度长文、方法论文章
- 分组：经典媒体

```css
body{font-family:Georgia,"Times New Roman","Songti SC","Noto Serif CJK SC",SimSun,serif;font-size:16px;line-height:1.92;color:#242424;max-width:680px;margin:0 auto;padding:34px 24px;background:#fff;}h1{font-size:28px;line-height:1.28;font-weight:700;text-align:left;margin:42px 0 28px;color:#111;}h2{font-size:22px;line-height:1.35;font-weight:700;margin:52px 0 18px;color:#111;}h3{font-size:18px;line-height:1.45;font-weight:700;margin:34px 0 12px;color:#333;}p{margin:15px 0;line-height:1.92;}blockquote{margin:28px 0;padding:0 0 0 22px;border-left:3px solid #242424;color:#444;font-size:17px;line-height:1.86;font-style:italic;}ul{margin:15px 0;padding-left:24px;}li{margin:8px 0;line-height:1.9;}strong{font-weight:800;color:#111;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#f2f2f2;color:#222;padding:2px 6px;border-radius:3px;font-size:14px;}pre{background:#f2f2f2;color:#222;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #d8d8d8;margin:40px auto;width:34%;}
```

## 03 wired：WIRED Feature

- 别名：WIRED、科技、AI、前沿、产品发布、有冲击力
- 适合：AI、科技观点、产品发布、前沿趋势
- 分组：经典媒体

```css
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.74;color:#111;max-width:750px;margin:0 auto;padding:22px;background:#fff;}h1{font-size:28px;line-height:1.16;font-weight:950;text-align:left;margin:36px 0 26px;color:#111;border-top:6px solid #111;border-bottom:6px solid #111;padding:16px 0;}h2{font-size:20px;line-height:1.35;font-weight:950;margin:44px 0 14px;color:#111;background:#f5ff00;padding:10px 12px;}h3{font-size:18px;line-height:1.4;font-weight:900;margin:32px 0 10px;color:#111;text-decoration:underline;text-decoration-thickness:4px;text-decoration-color:#00e5ff;text-underline-offset:5px;}p{margin:12px 0;line-height:1.74;}blockquote{margin:22px 0;padding:15px 16px;background:#111;color:#fff;border-left:0;font-weight:750;font-style:normal;}ul{margin:12px 0;padding-left:0;list-style:none;}li{margin:8px 0;line-height:1.72;padding:8px 10px;background:#f2f2f2;border-left:5px solid #111;}strong{font-weight:950;color:#111;background:#f5ff00;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#111;color:#00e5ff;padding:2px 6px;border-radius:0;font-size:14px;}pre{background:#111;color:#00e5ff;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;color:inherit;}hr{border:none;height:5px;background:#111;margin:34px 0;}
```

## 04 verge：The Verge Briefing

- 别名：The Verge、Verge、年轻、热点、资讯评论
- 适合：热点解读、产品更新、资讯评论
- 分组：经典媒体

```css
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.76;color:#171717;max-width:750px;margin:0 auto;padding:22px;background:#fff7fb;}h1{font-size:27px;line-height:1.2;font-weight:950;text-align:left;margin:36px 0 24px;color:#fff;background:#111;padding:18px 16px;box-shadow:8px 8px 0 #ff4fd8;}h2{font-size:20px;line-height:1.35;font-weight:900;margin:44px 0 14px;color:#111;padding:10px 12px;background:#bcff2f;}h3{font-size:18px;line-height:1.42;font-weight:880;margin:32px 0 10px;color:#111;border-bottom:3px solid #ff4fd8;padding-bottom:6px;}p{margin:12px 0;line-height:1.76;}blockquote{margin:22px 0;padding:14px 16px;border:3px solid #111;background:#fff;color:#111;font-weight:700;font-style:normal;}ul{margin:12px 0;padding-left:0;list-style:none;}li{margin:8px 0;line-height:1.74;padding:9px 10px;background:#fff;border-left:5px solid #ff4fd8;}strong{font-weight:950;color:#111;background:#bcff2f;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#111;color:#bcff2f;padding:2px 6px;border-radius:0;font-size:14px;}pre{background:#111;color:#bcff2f;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;color:inherit;}hr{border:none;height:3px;background:#ff4fd8;margin:34px 0;width:70%;}
```

## 05 stripe：Stripe Docs

- 别名：Stripe、文档、工具说明、教程、操作指南、产品文档
- 适合：教程、工具说明、Agent 工作流文档
- 分组：科技产品

```css
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.78;color:#2a2f45;max-width:760px;margin:0 auto;padding:24px 22px;background:#fbfcff;}h1{font-size:25px;line-height:1.32;font-weight:850;text-align:left;margin:36px 0 24px;color:#0a2540;}h2{font-size:19px;line-height:1.45;font-weight:820;margin:42px 0 14px;color:#0a2540;padding:10px 12px;background:#f1f5ff;border-left:4px solid #635bff;}h3{font-size:17px;line-height:1.5;font-weight:780;margin:30px 0 10px;color:#425466;}p{margin:12px 0;line-height:1.78;}blockquote{margin:20px 0;padding:14px 16px;background:#fff;border:1px solid #d9e2f3;border-left:4px solid #635bff;color:#3c4257;font-style:normal;}ul{margin:12px 0;padding-left:0;list-style:none;counter-reset:item;}li{margin:8px 0;line-height:1.76;padding:9px 10px;background:#fff;border:1px solid #e5ebf5;}li:before{counter-increment:item;content:"0" counter(item) " ";font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;font-size:12px;color:#635bff;font-weight:800;}strong{font-weight:850;color:#0a2540;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#eef2ff;color:#3b35a8;padding:2px 6px;border-radius:4px;font-size:14px;}pre{background:#eef2ff;color:#3b35a8;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #d9e2f3;margin:32px 0;}
```

## 06 apple：Apple Newsroom

- 别名：Apple、正式公告、品牌稿、产品介绍
- 适合：正式公告、产品介绍、品牌文章
- 分组：经典媒体

```css
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.82;color:#1d1d1f;max-width:730px;margin:0 auto;padding:34px 24px;background:#fff;}h1{font-size:30px;line-height:1.16;font-weight:800;text-align:center;margin:42px 0 30px;color:#1d1d1f;}h2{font-size:21px;line-height:1.42;font-weight:750;margin:48px 0 16px;color:#1d1d1f;text-align:center;}h3{font-size:18px;line-height:1.5;font-weight:700;margin:32px 0 10px;color:#424245;}p{margin:13px 0;line-height:1.82;}blockquote{margin:22px 0;padding:16px 18px;background:#f5f5f7;border-left:0;color:#424245;border-radius:10px;font-style:normal;}ul{margin:13px 0;padding-left:22px;}li{margin:7px 0;line-height:1.82;}strong{font-weight:800;color:#1d1d1f;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#f5f5f7;color:#1d1d1f;padding:2px 6px;border-radius:5px;font-size:14px;}pre{background:#f5f5f7;color:#1d1d1f;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;border-radius:10px;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #d2d2d7;margin:36px auto;width:42%;}
```

## 07 ft：FT Analysis

- 别名：FT、财经、商业分析、市场判断、对标研究
- 适合：商业分析、市场判断、对标研究
- 分组：经典媒体

```css
body{font-family:Georgia,"Times New Roman","Songti SC","Noto Serif CJK SC",SimSun,serif;font-size:16px;line-height:1.9;color:#262018;max-width:740px;margin:0 auto;padding:24px 22px;background:#fff1df;}h1{font-size:27px;line-height:1.3;font-weight:800;text-align:left;margin:38px 0 24px;color:#111;border-bottom:3px double #5a4a36;padding-bottom:14px;}h2{font-size:21px;line-height:1.42;font-weight:800;margin:46px 0 16px;color:#3b2b1d;padding-top:10px;border-top:1px solid #8a7356;}h3{font-size:18px;line-height:1.5;font-weight:750;margin:32px 0 10px;color:#4c3a29;}p{margin:13px 0;line-height:1.9;}blockquote{margin:22px 0;padding:12px 0 12px 18px;border-left:4px solid #8a7356;color:#4f4030;background:#f9e6cf;font-style:normal;}ul{margin:13px 0;padding-left:22px;}li{margin:7px 0;line-height:1.9;}strong{font-weight:850;color:#111;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#f5dec4;color:#3b2b1d;padding:2px 6px;border-radius:2px;font-size:14px;}pre{background:#f5dec4;color:#3b2b1d;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #8a7356;margin:34px 0;width:58%;}
```

## 08 linear：Linear Changelog

- 别名：Linear、changelog、版本更新、更新日志、路线图
- 适合：版本公告、功能更新、路线图说明
- 分组：科技产品

```css
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.76;color:#d7d7e1;max-width:750px;margin:0 auto;padding:24px 22px;background:#111114;}h1{font-size:25px;line-height:1.32;font-weight:850;text-align:left;margin:36px 0 24px;color:#fff;}h2{font-size:19px;line-height:1.45;font-weight:820;margin:40px 0 14px;color:#fff;padding:10px 0;border-bottom:1px solid #2b2b33;}h2:before{content:"◆ ";color:#8b5cf6;}h3{font-size:17px;line-height:1.5;font-weight:780;margin:30px 0 10px;color:#c4b5fd;}p{margin:12px 0;line-height:1.76;}blockquote{margin:20px 0;padding:14px 16px;background:#19191f;border:1px solid #2b2b33;color:#d7d7e1;font-style:normal;}ul{margin:12px 0;padding-left:0;list-style:none;}li{margin:8px 0;line-height:1.74;padding:9px 10px;background:#17171c;border-left:3px solid #8b5cf6;}strong{font-weight:850;color:#fff;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#242432;color:#c4b5fd;padding:2px 6px;border-radius:4px;font-size:14px;}pre{background:#242432;color:#c4b5fd;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #2b2b33;margin:32px 0;}
```

## 09 github：GitHub README

- 别名：GitHub、README、开源、安装说明
- 适合：安装说明、工具介绍、技术文档
- 分组：科技产品

```css
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.76;color:#24292f;max-width:760px;margin:0 auto;padding:24px 22px;background:#fff;}h1{font-size:26px;line-height:1.28;font-weight:750;text-align:left;margin:36px 0 22px;color:#24292f;padding-bottom:10px;border-bottom:1px solid #d0d7de;}h2{font-size:20px;line-height:1.45;font-weight:700;margin:38px 0 14px;color:#24292f;padding-bottom:8px;border-bottom:1px solid #d8dee4;}h3{font-size:17px;line-height:1.5;font-weight:700;margin:28px 0 10px;color:#24292f;}p{margin:11px 0;line-height:1.76;}blockquote{margin:18px 0;padding:8px 16px;border-left:4px solid #d0d7de;color:#57606a;background:#fff;font-style:normal;}ul{margin:12px 0;padding-left:24px;}li{margin:6px 0;line-height:1.76;}strong{font-weight:750;color:#24292f;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#f6f8fa;color:#24292f;padding:2px 6px;border-radius:4px;font-size:14px;}pre{background:#f6f8fa;color:#24292f;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #d0d7de;margin:28px 0;}
```

## 10 notion：Notion Memo

- 别名：Notion、备忘录、内部总结、项目复盘
- 适合：学习笔记、内部总结、项目复盘
- 分组：科技产品

```css
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.82;color:#37352f;max-width:720px;margin:0 auto;padding:28px 24px;background:#fffefc;}h1{font-size:27px;line-height:1.28;font-weight:780;text-align:left;margin:38px 0 24px;color:#37352f;}h2{font-size:20px;line-height:1.45;font-weight:720;margin:42px 0 14px;color:#37352f;background:#f7f6f3;padding:10px 12px;}h3{font-size:17px;line-height:1.5;font-weight:720;margin:30px 0 10px;color:#37352f;}p{margin:12px 0;line-height:1.82;}blockquote{margin:20px 0;padding:12px 16px;border-left:3px solid #9b9a97;background:#f7f6f3;color:#4f4d48;font-style:normal;}ul{margin:12px 0;padding-left:22px;}li{margin:7px 0;line-height:1.82;}strong{font-weight:800;color:#37352f;background:#fff2cc;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#f1f1ef;color:#37352f;padding:2px 6px;border-radius:3px;font-size:14px;}pre{background:#f1f1ef;color:#37352f;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #e7e6e2;margin:32px 0;}
```

## 11 magazine：Magazine Feature

- 别名：杂志、人物稿、品牌故事、专题
- 适合：人物稿、品牌故事、深度专题
- 分组：内容出版

```css
body{font-family:Georgia,"Times New Roman","Songti SC","Noto Serif CJK SC",SimSun,serif;font-size:16px;line-height:1.94;color:#282828;max-width:700px;margin:0 auto;padding:30px 24px;background:#fff;}h1{font-size:28px;line-height:1.3;font-weight:700;text-align:center;margin:42px 0 30px;color:#111;}h1:after{content:"";display:block;width:46px;height:1px;background:#111;margin:20px auto 0;}h2{font-size:21px;line-height:1.45;font-weight:700;margin:50px 0 18px;color:#111;text-align:center;}h3{font-size:18px;line-height:1.5;font-weight:700;margin:34px 0 12px;color:#333;text-align:center;}p{margin:15px 0;line-height:1.94;}blockquote{margin:26px 0;padding:0 22px;border-left:0;color:#555;font-size:15px;line-height:1.95;text-align:center;font-style:italic;}blockquote:before{content:"“";display:block;font-size:38px;line-height:0.9;color:#a0a0a0;}ul{margin:15px 0;padding-left:22px;}li{margin:8px 0;line-height:1.92;}strong{font-weight:800;color:#111;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#f3f3f3;color:#222;padding:2px 6px;border-radius:2px;font-size:14px;}pre{background:#f3f3f3;color:#222;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #bdbdbd;margin:36px auto;width:46%;}
```

## 12 editorial：Editorial Column

- 别名：专栏、手记、创作者随笔、复盘札记
- 适合：创作者手记、观点随笔、复盘札记
- 分组：内容出版

```css
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.92;color:#252525;max-width:680px;margin:0 auto;padding:28px 24px;background:#fff;}h1{font-size:25px;line-height:1.42;font-weight:650;text-align:left;margin:38px 0 24px;color:#111;}h2{font-size:19px;line-height:1.5;font-weight:700;margin:46px 0 16px;color:#111;}h2:before{content:"";display:block;width:34px;height:2px;background:#111;margin:0 0 12px;}h3{font-size:17px;line-height:1.55;font-weight:700;margin:32px 0 12px;color:#333;}p{margin:14px 0;line-height:1.92;}blockquote{margin:22px 0;padding:0 0 0 18px;border-left:2px solid #222;color:#4f4f4f;font-size:15px;line-height:1.9;font-style:normal;}ul{margin:14px 0;padding-left:20px;}li{margin:7px 0;line-height:1.9;}strong{font-weight:800;color:#111;background:linear-gradient(transparent 62%,#eeeeee 0);}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#f5f5f5;color:#222;padding:2px 6px;border-radius:3px;font-size:14px;}pre{background:#f5f5f5;color:#222;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #e0e0e0;margin:34px 0;}
```

## 13 newspaper：Newspaper Report

- 别名：报纸、报道、调查、严肃分析
- 适合：调查稿、商业报道、严肃分析
- 分组：内容出版

```css
body{font-family:"Songti SC","Noto Serif CJK SC",Georgia,"Times New Roman",SimSun,serif;font-size:16px;line-height:1.88;color:#202020;max-width:760px;margin:0 auto;padding:22px;background:#fff;}h1{font-size:25px;line-height:1.36;font-weight:800;text-align:left;margin:34px 0 20px;color:#111;padding:0 0 14px;border-bottom:3px double #111;}h2{font-size:20px;line-height:1.42;font-weight:800;margin:42px 0 14px;color:#111;padding-top:10px;border-top:2px solid #111;}h3{font-size:17px;line-height:1.5;font-weight:800;margin:30px 0 10px;color:#222;}p{margin:12px 0;line-height:1.88;}blockquote{margin:20px 0;padding:12px 0 12px 18px;border-left:4px solid #555;color:#444;background:#fafafa;font-style:normal;}ul{margin:12px 0;padding-left:21px;}li{margin:7px 0;line-height:1.88;}strong{font-weight:800;color:#111;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#eeeeee;color:#222;padding:2px 6px;border-radius:1px;font-size:14px;}pre{background:#eeeeee;color:#222;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #999;margin:30px 0;}
```

## 14 course：课程讲义

- 别名：课程、学习笔记、讲义、教程
- 适合：课程、教程、学习笔记、操作说明
- 分组：中文公众号

```css
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.84;color:#272727;max-width:750px;margin:0 auto;padding:22px;background:#fff;}h1{font-size:24px;line-height:1.38;font-weight:800;text-align:center;margin:34px 0 22px;color:#111;}h2{font-size:19px;line-height:1.45;font-weight:800;margin:40px 0 16px;color:#111;padding:11px 14px;background:#f3f3f3;}h3{font-size:17px;line-height:1.5;font-weight:800;margin:30px 0 10px;color:#111;padding-bottom:6px;border-bottom:1px dotted #aaa;}p{margin:12px 0;line-height:1.84;}blockquote{margin:18px 0;padding:14px 16px;background:#f8f8f8;border-left:0;border-top:1px solid #e1e1e1;border-bottom:1px solid #e1e1e1;color:#444;font-style:normal;}ul{margin:12px 0;padding-left:20px;}li{margin:7px 0;line-height:1.84;}strong{font-weight:850;color:#111;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#eeeeee;color:#222;padding:2px 6px;border-radius:3px;font-size:14px;}pre{background:#eeeeee;color:#222;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;border-top:1px solid #ddd;margin:30px 0;}
```

## 15 event：活动公告

- 别名：活动、招募、转化、通知、公告
- 适合：活动通知、招募、发布公告、转化文
- 分组：中文公众号

```css
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.78;color:#2c2424;max-width:740px;margin:0 auto;padding:22px;background:#fff;}h1{font-size:24px;line-height:1.35;font-weight:900;text-align:center;margin:34px 0 20px;color:#8f1f1d;padding:18px 12px;border:2px solid #8f1f1d;background:#fffafa;}h2{font-size:19px;line-height:1.45;font-weight:850;margin:40px 0 14px;color:#8f1f1d;padding:0 0 10px;border-bottom:2px solid #8f1f1d;}h3{font-size:17px;line-height:1.5;font-weight:800;margin:30px 0 10px;color:#4a2a2a;}p{margin:12px 0;line-height:1.78;}blockquote{margin:18px 0;padding:14px 16px;background:#8f1f1d;color:#fff;border-left:0;font-style:normal;}ul{margin:12px 0;padding-left:20px;}li{margin:7px 0;line-height:1.78;}strong{font-weight:900;color:#8f1f1d;}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;background:#fff0f0;color:#8f1f1d;padding:2px 6px;border-radius:3px;font-size:14px;}pre{background:#fff0f0;color:#8f1f1d;padding:14px 16px;overflow:auto;font-size:14px;line-height:1.6;}pre code{background:none;padding:0;}hr{border:none;height:2px;background:#8f1f1d;margin:30px 0;}
```