` 元素中：\n\n```javascript\nkatex.render(\n \"\\\\text{score}(t,d) = IDF(t) \\\\times \\\\frac{f(t,d) \\\\cdot (k_1 + 1)}{f(t,d) + k_1 \\\\cdot (1 - b + b \\\\cdot \\\\frac{|d|}{avgdl})}\",\n document.getElementById(\"formula-main\"),\n { displayMode: true, throwOnError: false }\n);\n```\n\n### 注意事项\n\n- **注意大小写**：CDN 加载的是小写 `katex`，调用时也要用小写\n- **使用 `window.onload`**：确保 DOM 加载完成后再渲染公式\n- **给公式留空容器**：先在 HTML 中放一个空的 `
`，JS 渲染到容器中\n- **设置 `displayMode: true`**：公式较长时使用行内显示模式\n\n### 示例公式容器\n\n```html\n
\n \n
\n```\n\n---\n\n## 注意事项\n\n1. **图片宽度固定 680px**，适配小红书笔记宽度\n2. **长图高度根据内容自动增长**，完整包含所有信息\n3. **标签使用 emoji + 文字**，增加视觉吸引力\n4. **摘要控制在 100 字以内**，小红书显示完整\n5. **标题控制在 20 字以内**，超过会被截断\n6. **风格默认选择**：技术类 → 科技风，营销/个人类 → 热情风\n7. **代码块格式**：代码语句之间用 `
` 换行保持独立行，函数体/回调/链式调用使用 2 空格缩进，禁止所有代码挤在一行\n\nFile v1.0.2:_meta.json\n\n{\n \"ownerId\": \"kn739fhz3rn1yz422hv1rw15sh858b77\",\n \"slug\": \"red-book-content-creation\",\n \"version\": \"1.0.2\",\n \"publishedAt\": 1778464811561\n}\n\nFile v1.0.2:skill-card.md\n\n## Description:\n\nConverts articles, technical documents, and other text into Xiaohongshu-ready HTML pages with a title, summary, cover, and screenshot-ready visual content.\n\nThis skill is ready for commercial/non-commercial use.\n\n## Publisher:\n\n[wenhulove333](https://clawhub.ai/user/wenhulove333)\n\n### License/Terms of Use:\n\nMIT-0\n\n## Use Case:\n\nContent creators, marketers, and developers use this skill to turn Markdown or plain text into Xiaohongshu-style visual posts for technical explainers, product introductions, marketing content, and knowledge sharing.\n\n### Deployment Geography for Use:\n\nGlobal\n\n## Known Risks and Mitigations:\n\nRisk: User-provided text is inserted into generated HTML by the local shell generator without safe escaping.\n\nMitigation: Review generated HTML before rendering, avoid untrusted or sensitive input, and replace shell placeholder substitution with safe escaping before deployment.\n\nRisk: Rendering generated HTML can execute template scripts and load KaTeX assets from a CDN.\n\nMitigation: Render in a sandboxed environment and document or restrict network access for CDN-loaded assets.\n\nRisk: Generated HTML and PNG outputs may retain user content on disk.\n\nMitigation: Define output retention and cleanup practices before using the skill with confidential material.\n\n## Reference(s):\n\n- [ClawHub skill page](https://clawhub.ai/wenhulove333/skills/red-book-content-creation)\n- [KaTeX stylesheet CDN](https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css)\n- [KaTeX script CDN](https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js)\n\n## Skill Output:\n\n**Output Type(s):** [text, markdown, code, shell commands, files, guidance]\n\n**Output Format:** [Markdown guidance with generated HTML, shell commands, and PNG/HTML output file paths.]\n\n**Output Parameters:** [1D]\n\n**Other Properties Related to Output:** [Uses 680px-wide HTML templates and screenshot generation for Xiaohongshu-style image posts.]\n\n## Skill Version(s):\n\n1.0.2 (source: server release metadata)\n\n## Ethical Considerations:\n\nUsers should evaluate whether this skill is appropriate for their environment, review any generated or modified files before relying on them, and apply their organization's safety, security, and compliance requirements before deployment.\n\nArchive v1.0.1: 6 files, 10043 bytes\n\nFiles: scripts/generate_content.sh (3552b), scripts/take_screenshot.py (2839b), SKILL.md (6302b), templates/passion_style.html (5035b), templates/tech_style.html (5061b), _meta.json (144b)\n\nFile v1.0.1:SKILL.md\n\n---\nname: xiaohongshu-content\ndescription: >\n 将文章、技术文档等内容转换为适合小红书发布的 HTML 格式，生成封面图和内容截图，配好标题和正文摘要。\n 用户提供原始内容（Markdown 或纯文本）后，AI 生成适配小红书风格的多图 HTML 页面，并调用截图工具生成可直接发布的图片。\n 适用于：技术博客分享、知识干货、產品介绍、营销内容等。\n---\n\n# 小红书内容生成技能\n\n## 功能概述\n\n将任意文章/内容转换为**小红书风格**的 HTML 页面，输出多张可截图发布的图片，并附上**标题 + 正文摘要**。\n\n支持**两种风格**：\n- 🎨 **热情风**（红色系）：#FF6B6B → #FF8E53 橙红渐变，适合激情、励志、营销类内容\n- 🔬 **科技风**（蓝紫系）：#4A90E2 → #7B68EE 蓝紫渐变，适合技术干货、科普、编程类内容\n\n---\n\n## 风格选择\n\n| 风格 | 主色调 | 渐变 | 适用场景 |\n|------|--------|------|----------|\n| **热情风** | #FF6B6B (珊瑚红) | #FF6B6B → #FF8E53 | 营销/励志/个人成长/情感类 |\n| **科技风** | #4A90E2 (科技蓝) | #4A90E2 → #7B68EE | 技术干货/编程/数据库/架构类 |\n\n生成内容时，根据内容主题自动选择风格：\n- 数据库、缓存、架构、编程 → **科技风**\n- 营销、增长、个人IP、情感 → **热情风**\n- 可通过指令指定风格，如\"用热情风生成\"\n\n---\n\n## 使用方式\n\n### 方式一：发送内容给 AI\n\n直接把你的文章内容发给我（可以是 Markdown 或纯文本），告诉我\"帮我生成小红书内容\"或\"做成适合小红书的格式\"。\n\n**示例：**\n> \"帮我把这篇关于 Redis 缓存的文章做成小红书风格的内容\"\n\n**我会自动：**\n1. 分析内容结构，提取核心要点\n2. 根据内容类型选择合适风格（科技风/热情风）\n3. 生成适配小红书的 HTML 页面（封面 + 多个内容区块）\n4. 截图并发送给你\n5. 提供标题和正文建议\n\n### 方式二：命令行调用\n\n```bash\ncd ~/.openclaw/workspace/skills/xiaohongshu-content\nbash scripts/generate_content.sh \"你的内容\" \"输出标题\" [tech|passion]\n```\n\n---\n\n## 输出规格\n\n| 项目 | 说明 |\n|------|------|\n| **图片数量** | 1张完整长图（包含所有内容） |\n| **图片格式** | PNG |\n| **图片宽度** | 680px（小红书标准宽度） |\n| **图片高度** | 自动（根据内容长度） |\n| **HTML输出** | 可在浏览器打开查看完整效果 |\n| **截图工具** | wkhtmltoimage |\n\n---\n\n## HTML 模板\n\n技能包含两个预设模板：\n\n### 科技风 (tech_style.html)\n- **主色**: #4A90E2 (科技蓝)\n- **渐变**: #4A90E2 → #7B68EE (蓝紫渐变)\n- **背景**: #F0F4FF / #F8F0FF (淡蓝/淡紫)\n- **强调色**: #4A90E2 (蓝), #7B68EE (紫)\n- **适用**: 技术干货、编程、数据库、架构、DevOps 等\n\n### 热情风 (passion_style.html)\n- **主色**: #FF6B6B (珊瑚红)\n- **渐变**: #FF6B6B → #FF8E53 (橙红渐变)\n- **背景**: #FFF5F5 / #FFF9F0 (淡粉/淡黄)\n- **强调色**: #FF6B6B (红), #FF8E53 (橙)\n- **适用**: 营销、个人成长、情感、励志等\n\n### 通用组件\n\n两种风格共用相同的组件结构：\n- **封面卡片**：emoji + 标题 + 副标题 + 标签\n- **内容卡片**：图标 + 标题 + 副标题 + 要点列表 + 类比框\n- **对比表格**：渐变色表头 + 斑马纹行\n- **流程图**：渐变按钮 + 箭头\n- **徽章标签**：圆角胶囊样式\n- **总结网格**：2列 Summary Card\n\n---\n\n## 截图脚本用法\n\n```bash\ncd /root/.openclaw/workspace/skills/xiaohongshu-content/outputs\n\n# 生成长图（完整内容）\nwkhtmltoimage --width 680 --quality 90 input.html output.png\n\n# Python 截图（可获取精确尺寸）\npython3 scripts/take_screenshot.py --input input.html --output output.png --width 680\n```\n\n---\n\n## 标题与摘要生成规则\n\n### 标题公式\n\n```\n[符号] + [核心关键词] + [效果词] + [平台词]\n\n示例（科技风）：\n🔍 一文搞懂MySQL索引核心原理\n💡 5分钟理解Redis缓存雪崩\n🚀 微服务架构避坑指南\n\n示例（热情风）：\n🔥 这个思维模式，悄悄拉开了差距\n✨ 3个技巧，让你的效率翻倍\n💪 坚持30天，发生惊人变化\n```\n\n### 摘要公式\n\n```\n[一句话概括价值] + [时间/难度暗示] + [行动引导]\n\n示例：\nRedis缓存穿透、击穿、雪崩一篇全搞懂，收藏慢慢看～\n#Redis #缓存技术 #后端开发 #知识分享\n```\n\n### 标签策略\n\n- 3-5个标签\n- 结构：1个领域词 + 1-2个技术词 + 1个平台词 + 1个情绪词\n- 示例：#MySQL #数据库索引 #技术干货 #知识分享\n\n---\n\n## 依赖项\n\n| 依赖 | 用途 | 安装 |\n|------|------|------|\n| Python3 | 截图脚本 | 系统自带 |\n| wkhtmltoimage | HTML渲染引擎 | `apt install wkhtmltopdf` |\n| ImageMagick | 图片裁剪 | `apt install imagemagick` |\n\n---\n\n## 文件结构\n\n```\nxiaohongshu-content/\n├── SKILL.md # 本技能说明\n├── scripts/\n│ ├── generate_content.sh # 内容生成主脚本\n│ ├── take_screenshot.py # Python截图工具\n│ └── open_preview.sh # 浏览器打开预览\n├── templates/\n│ ├── tech_style.html # 科技风模板（蓝紫渐变）\n│ └── passion_style.html # 热情风模板（红橙渐变）\n└── outputs/ # 生成的内容目录\n```\n\n---\n\n## 示例输出\n\n用户提供内容 → AI 生成以下内容：\n\n**标题：** 🔍 MySQL 索引全景图解｜用图书馆类比秒懂索引底层逻辑\n\n**正文：**\n> 聚簇索引、非聚簇索引、ICP、MRR、GROUP BY、最左前缀 —— 这篇用\"图书馆\"类比帮你彻底搞懂！\n> 收藏慢慢看 💪\n> #MySQL #数据库索引 #技术干货 #知识分享 #后端开发\n\n**图片：** 1 张完整长图（可发布到小红书）\n\n---\n\n## 注意事项\n\n1. **图片宽度固定 680px**，适配小红书笔记宽度\n2. **长图高度根据内容自动增长**，完整包含所有信息\n3. **标签使用 emoji + 文字**，增加视觉吸引力\n4. **摘要控制在 100 字以内**，小红书显示完整\n5. **标题控制在 20 字以内**，超过会被截断\n6. **风格默认选择**：技术类 → 科技风，营销/个人类 → 热情风\n\nFile v1.0.1:_meta.json\n\n{\n \"ownerId\": \"kn739fhz3rn1yz422hv1rw15sh858b77\",\n \"slug\": \"red-book-content-creation\",\n \"version\": \"1.0.1\",\n \"publishedAt\": 1777257609085\n}\n\nArchive v1.0.0: 5 files, 9963 bytes\n\nFiles: scripts/generate_content.sh (3552b), scripts/take_screenshot.py (2839b), SKILL.md (5733b), templates/content_template.html (15721b), _meta.json (144b)\n\nFile v1.0.0:SKILL.md\n\n---\nname: xiaohongshu-content\ndescription: >\n 将文章、技术文档等内容转换为适合小红书发布的 HTML 格式，生成封面图和内容截图，配好标题和正文摘要。\n 用户提供原始内容（Markdown 或纯文本）后，AI 生成适配小红书风格的多图 HTML 页面，并调用截图工具生成可直接发布的图片。\n 适用于：技术博客分享、知识干货、產品介绍、营销内容等。\n---\n\n# 小红书内容生成技能\n\n## 功能概述\n\n将任意文章/内容转换为**小红书风格**的 HTML 页面，输出多张可截图发布的图片，并附上**标题 + 正文摘要**。\n\n---\n\n## 使用方式\n\n### 方式一：发送内容给 AI\n\n直接把你的文章内容发给我（可以是 Markdown 或纯文本），告诉我\"帮我生成小红书内容\"或\"做成适合小红书的格式\"。\n\n**示例：**\n> \"帮我把这篇关于 BM25 算法的文章做成小红书风格的内容\"\n\n**我会自动：**\n1. 分析内容结构，提取核心要点\n2. 生成适配小红书的 HTML 页面（封面 + 多个内容区块）\n3. 截图并发送给你\n4. 提供标题和正文建议\n\n### 方式二：命令行调用\n\n```bash\n# 手动执行内容生成\ncd ~/.openclaw/workspace/skills/xiaohongshu-content\nbash scripts/generate_content.sh \"你的内容\" \"输出标题\"\n```\n\n---\n\n## 输出规格\n\n| 项目 | 说明 |\n|------|------|\n| **图片数量** | 1张封面 + 2-5张内容图（视内容长度） |\n| **图片格式** | PNG |\n| **图片宽度** | 680px（小红书标准宽度） |\n| **HTML输出** | 可在浏览器打开查看完整效果 |\n| **截图工具** | wkhtmltoimage 或 Chromium headless |\n\n---\n\n## HTML 页面结构\n\n```\n┌─────────────────────────┐\n│ 封面 (Header) │ ← 标题 + 副标题 + 标签\n├─────────────────────────┤\n│ 内容卡片 1 │ ← 核心要点/问题\n├─────────────────────────┤\n│ 内容卡片 2 │ ← 公式/原理\n├─────────────────────────┤\n│ 内容卡片 3 │ ← 参数/应用\n├─────────────────────────┤\n│ 总结卡片 │ ← 核心结论\n└─────────────────────────┘\n```\n\n---\n\n## HTML 模板设计规范\n\n### 配色方案（小红书风格）\n\n- **主色**: #FF6B6B (珊瑚红)\n- **渐变**: #FF6B6B → #FF8E53 (橙红渐变)\n- **背景**: #FFF5F5 / #FFF9F0 / #F0F8FF (淡粉/淡黄/淡蓝)\n- **文字**: #333333 (深灰), #666666 (中灰), #FF6B6B (强调)\n\n### 字体\n\n- 标题: 28px, 700, sans-serif\n- 副标题: 18px, 600\n- 正文: 14px, 400\n- 标签: 12px, 圆角背景\n\n### 卡片样式\n\n- 圆角: 16px\n- 阴影: 0 4px 20px rgba(0,0,0,0.05)\n- 内边距: 24px\n- 左边框: 4px 渐变色\n\n---\n\n## 截图脚本用法\n\n### Python 截图（推荐）\n\n```bash\ncd ~/.openclaw/workspace/skills/xiaohongshu-content\npython3 scripts/take_screenshot.py \\\n --input /path/to/content.html \\\n --output /path/to/output.png \\\n --width 680 \\\n --height 800\n```\n\n### Chromium 截图\n\n```bash\nchromium-browser --headless \\\n --disable-gpu \\\n --no-sandbox \\\n --screenshot=output.png \\\n --window-size=680,500 \\\n --crop-y=0 --crop-h=500 \\\n file:///path/to/content.html\n```\n\n### wkhtmltoimage 截图\n\n```bash\nwkhtmltoimage --width 680 --quality 90 \\\n /path/to/content.html /path/to/output.png\n```\n\n---\n\n## 标题与摘要生成规则\n\n### 标题公式\n\n```\n[符号] + [核心关键词] + [效果词] + [平台词]\n\n示例：\n🔍 一文搞懂搜索引擎背后的BM25算法\n💡 5分钟理解RAG技术原理\n🚀 Redis 性能优化实战总结\n```\n\n### 摘要公式\n\n```\n[一句话概括价值] + [时间/难度暗示] + [行动引导]\n\n示例：\nBM25是TF-IDF的升级版，解决了词频无上限和长度不公平两大问题！\n收藏慢慢看，干货满满～\n#标签1 #标签2 #标签3\n```\n\n### 标签策略\n\n- 3-5个标签\n- 结构：1个领域词 + 1-2个技术词 + 1个平台词 + 1个情绪词\n- 示例：#算法 #搜索引擎 #BM25 #知识分享 #技术干货\n\n---\n\n## 依赖项\n\n| 依赖 | 用途 | 安装 |\n|------|------|------|\n| Python3 | 截图脚本 | 系统自带 |\n| imgkit | HTML转图片 | `pip install imgkit` |\n| wkhtmltoimage | HTML渲染引擎 | `apt install wkhtmltopdf` |\n| chromium-browser | 备选渲染引擎 | 系统安装 |\n\n---\n\n## 文件结构\n\n```\nxiaohongshu-content/\n├── SKILL.md # 本技能说明\n├── scripts/\n│ ├── generate_content.sh # 内容生成主脚本\n│ ├── take_screenshot.py # Python截图工具\n│ └── open_preview.sh # 浏览器打开预览\n├── templates/\n│ └── content_template.html # HTML模板\n└── outputs/ # 生成的内容目录\n```\n\n---\n\n## 注意事项\n\n1. **图片宽度固定 680px**，适配小红书笔记宽度\n2. **内容卡片控制在 500-800px 高度**，便于截取完整信息\n3. **标签使用 emoji + 文字**，增加视觉吸引力\n4. **摘要控制在 100 字以内**，小红书显示完整\n5. **标题控制在 20 字以内**，超过会被截断\n\n---\n\n## 示例输出\n\n用户提供内容 → AI 生成以下内容：\n\n**标题：** 🔍 一文搞懂搜索引擎背后的BM25算法\n\n**正文：**\n> BM25是TF-IDF的升级版，通过词频饱和和长度归一化让搜索结果更准确！收藏慢慢看～\n> #算法 #搜索引擎 #BM25 #知识分享\n\n**图片：** 封面图 × 1 + 内容图 × 3\n\nFile v1.0.0:_meta.json\n\n{\n \"ownerId\": \"kn739fhz3rn1yz422hv1rw15sh858b77\",\n \"slug\": \"red-book-content-creation\",\n \"version\": \"1.0.0\",\n \"publishedAt\": 1776753528498\n}","readmeExcerpt":"Skill: Red book content creation Owner: wenhulove333 Summary: 将文章、技术文档等内容转换为适合小红书发布的 HTML 格式，生成封面图和内容截图，配好标题和正文摘要。 用户提供原始内容（Markdown 或纯文本）后，AI 生成适配小红书风格的多图 HTML 页面，并调用截图工具生成可直接发布的图片。 适用于：技术博客分享、知识干货、產品介绍、营销内容等。 Tags: latest:1.0.2 Version history: v1.0.2 | 2026-05-11T02:00:11.561Z | user - 新增对数学公式渲染支持，内容包含公式时自动引入 katex 并渲染 - 文档详细说明 katex 的引入方式、渲染方法及注意事项 - 增加公式容器与渲染示例代码（含 window.onload 建议） - 注意事项中新增“代码块格式规范”条目，细化代码展示标准","codeSnippets":[],"executableExamples":[{"language":"bash","snippet":"cd ~/.openclaw/workspace/skills/xiaohongshu-content\nbash scripts/generate_content.sh \"你的内容\" \"输出标题\" [tech|passion]"},{"language":"bash","snippet":"cd /root/.openclaw/workspace/skills/xiaohongshu-content/outputs\n\n# 生成长图（完整内容）\nwkhtmltoimage --width 680 --quality 90 input.html output.png\n\n# Python 截图（可获取精确尺寸）\npython3 scripts/take_screenshot.py --input input.html --output output.png --width 680"},{"language":"text","snippet":"[符号] + [核心关键词] + [效果词] + [平台词]\n\n示例（科技风）：\n🔍 一文搞懂MySQL索引核心原理\n💡 5分钟理解Redis缓存雪崩\n🚀 微服务架构避坑指南\n\n示例（热情风）：\n🔥 这个思维模式，悄悄拉开了差距\n✨ 3个技巧，让你的效率翻倍\n💪 坚持30天，发生惊人变化"},{"language":"text","snippet":"[一句话概括价值] + [时间/难度暗示] + [行动引导]\n\n示例：\nRedis缓存穿透、击穿、雪崩一篇全搞懂，收藏慢慢看～\n#Redis #缓存技术 #后端开发 #知识分享"},{"language":"text","snippet":"xiaohongshu-content/\n├── SKILL.md # 本技能说明\n├── scripts/\n│ ├── generate_content.sh # 内容生成主脚本\n│ ├── take_screenshot.py # Python截图工具\n│ └── open_preview.sh # 浏览器打开预览\n├── templates/\n│ ├── tech_style.html # 科技风模板（蓝紫渐变）\n│ └── passion_style.html # 热情风模板（红橙渐变）\n└── outputs/ # 生成的内容目录"},{"language":"html","snippet":"
\n"}],"parameters":null,"dependencies":[],"permissions":[],"extractedFiles":[{"path":"SKILL.md","content":"---\nname: xiaohongshu-content\ndescription: >\n 将文章、技术文档等内容转换为适合小红书发布的 HTML 格式，生成封面图和内容截图，配好标题和正文摘要。\n 用户提供原始内容（Markdown 或纯文本）后，AI 生成适配小红书风格的多图 HTML 页面，并调用截图工具生成可直接发布的图片。\n 适用于：技术博客分享、知识干货、產品介绍、营销内容等。\n---\n\n# 小红书内容生成技能\n\n## 功能概述\n\n将任意文章/内容转换为**小红书风格**的 HTML 页面，输出多张可截图发布的图片，并附上**标题 + 正文摘要**。\n\n支持**两种风格**：\n- 🎨 **热情风**（红色系）：#FF6B6B → #FF8E53 橙红渐变，适合激情、励志、营销类内容\n- 🔬 **科技风**（蓝紫系）：#4A90E2 → #7B68EE 蓝紫渐变，适合技术干货、科普、编程类内容\n\n---\n\n## 风格选择\n\n| 风格 | 主色调 | 渐变 | 适用场景 |\n|------|--------|------|----------|\n| **热情风** | #FF6B6B (珊瑚红) | #FF6B6B → #FF8E53 | 营销/励志/个人成长/情感类 |\n| **科技风** | #4A90E2 (科技蓝) | #4A90E2 → #7B68EE | 技术干货/编程/数据库/架构类 |\n\n生成内容时，根据内容主题自动选择风格：\n- 数据库、缓存、架构、编程 → **科技风**\n- 营销、增长、个人IP、情感 → **热情风**\n- 可通过指令指定风格，如\"用热情风生成\"\n\n---\n\n## 使用方式\n\n### 方式一：发送内容给 AI\n\n直接把你的文章内容发给我（可以是 Markdown 或纯文本），告诉我\"帮我生成小红书内容\"或\"做成适合小红书的格式\"。\n\n**示例：**\n> \"帮我把这篇关于 Redis 缓存的文章做成小红书风格的内容\"\n\n**我会自动：**\n1. 分析内容结构，提取核心要点\n2. 根据内容类型选择合适风格（科技风/热情风）\n3. 生成适配小红书的 HTML 页面（封面 + 多个内容区块）\n4. 截图并发送给你\n5. 提供标题和正文建议\n\n### 方式二：命令行调用\n\n```bash\ncd ~/.openclaw/workspace/skills/xiaohongshu-content\nbash scripts/generate_content.sh \"你的内容\" \"输出标题\" [tech|passion]\n```\n\n---\n\n## 输出规格\n\n| 项目 | 说明 |\n|------|------|\n| **图片数量** | 1张完整长图（包含所有内容） |\n| **图片格式** | PNG |\n| **图片宽度** | 680px（小红书标准宽度） |\n| **图片高度** | 自动（根据内容长度） |\n| **HTML输出** | 可在浏览器打开查看完整效果 |\n| **截图工具** | wkhtmltoimage |\n\n---\n\n## HTML 模板\n\n技能包含两个预设模板：\n\n### 科技风 (tech_style.html)\n- **主色**: #4A90E2 (科技蓝)\n- **渐变**: #4A90E2 → #7B68EE (蓝紫渐变)\n- **背景**: #F0F4FF / #F8F0FF (淡蓝/淡紫)\n- **强调色**: #4A90E2 (蓝), #7B68EE (紫)\n- **适用**: 技术干货、编程、数据库、架构、DevOps 等\n\n### 热情风 (passion_style.html)\n- **主色**: #FF6B6B (珊瑚红)\n- **渐变**: #FF6B6B → #FF8E53 (橙红渐变)\n- **背景**: #FFF5F5 / #FFF9F0 (淡粉/淡黄)\n- **强调色**: #FF6B6B (红), #FF8E53 (橙)\n- **适用**: 营销、个人成长、情感、励志等\n\n### 通用组件\n\n两种风格共用相同的组件结构：\n- **封面卡片**：emoji + 标题 + 副标题 + 标签\n- **内容卡片**：图标 + 标题 + 副标题 + 要点列表 + 类比框\n- **对比表格**：渐变色表头 + 斑马纹行\n- **流程图**：渐变按钮 + 箭头\n- **徽章标签**：圆角胶囊样式\n- **总结网格**：2列 Summary Card\n\n---\n\n## 截图脚本用法\n\n```bash\ncd /root/.openclaw/workspace/skills/xiaohongshu-content/outputs\n\n# 生成长图（完整内容）\nwkhtmltoimage --width 680 --quality 90 input.html output.png\n\n# Python 截图（可获取精确尺寸）\npython3 scripts/take_screenshot.py --input input.html --output output.png --width 680\n```\n\n---\n\n## 标题与摘要生成规则\n\n### 标题公式\n\n```\n[符号] + [核心关键词] + [效果词] + [平台词]\n\n示例（科技风）：\n🔍 一文搞懂MySQL索引核心原理\n💡 5分钟理解Redis缓存雪崩\n🚀 微服务架构避坑指南\n\n示例（热情风）：\n🔥 这个思维模式，悄悄拉开了差距\n✨ 3个技巧，让你的效率翻倍\n💪 坚持30天，发生惊人变化\n```\n\n### 摘要公式\n\n```\n[一句话概括价值] + [时间/难度暗示] + [行动引导]\n\n示例：\nRedis缓存穿透、击穿、雪崩一篇全搞懂，收藏慢慢看～\n#Redis #缓存技术 #后端开发 #知识分享\n```\n\n### 标签策略\n\n- 3-5个标签\n- 结构：1个领域词 + 1-2个技术词 + 1个平台词 + 1个情绪词\n- 示例：#MySQL #数据库索引 #技术干货 #知识分享\n\n---\n\n## 依赖项\n\n| 依赖 | 用途 | 安装 |\n|------|------|------|\n| Python3 | 截图脚本 | 系统自带 |\n| wkhtmltoimage | HTML渲染引擎 | `apt install wkhtmltopdf` |\n| ImageMagick | 图片裁剪 | `apt install imagemagick` |\n\n---\n\n## 文件结构\n\n```\nxiaohongshu-content/\n├── SKILL.md # 本技能说明\n├── scripts/\n│ ├── generate_content.sh # 内容生成主脚本\n│ ├── take_screenshot.py # Python截图工具\n│ └── open_preview.sh # 浏览器打开预览\n├── templates/\n│ ├── te"},{"path":"_meta.json","content":"{\n \"ownerId\": \"kn739fhz3rn1yz422hv1rw15sh858b77\",\n \"slug\": \"red-book-content-creation\",\n \"version\": \"1.0.2\",\n \"publishedAt\": 1778464811561\n}"},{"path":"skill-card.md","content":"## Description:\n\nConverts articles, technical documents, and other text into Xiaohongshu-ready HTML pages with a title, summary, cover, and screenshot-ready visual content.\n\nThis skill is ready for commercial/non-commercial use.\n\n## Publisher:\n\n[wenhulove333](https://clawhub.ai/user/wenhulove333)\n\n### License/Terms of Use:\n\nMIT-0\n\n## Use Case:\n\nContent creators, marketers, and developers use this skill to turn Markdown or plain text into Xiaohongshu-style visual posts for technical explainers, product introductions, marketing content, and knowledge sharing.\n\n### Deployment Geography for Use:\n\nGlobal\n\n## Known Risks and Mitigations:\n\nRisk: User-provided text is inserted into generated HTML by the local shell generator without safe escaping.\n\nMitigation: Review generated HTML before rendering, avoid untrusted or sensitive input, and replace shell placeholder substitution with safe escaping before deployment.\n\nRisk: Rendering generated HTML can execute template scripts and load KaTeX assets from a CDN.\n\nMitigation: Render in a sandboxed environment and document or restrict network access for CDN-loaded assets.\n\nRisk: Generated HTML and PNG outputs may retain user content on disk.\n\nMitigation: Define output retention and cleanup practices before using the skill with confidential material.\n\n## Reference(s):\n\n- [ClawHub skill page](https://clawhub.ai/wenhulove333/skills/red-book-content-creation)\n- [KaTeX stylesheet CDN](https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css)\n- [KaTeX script CDN](https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js)\n\n## Skill Output:\n\n**Output Type(s):** [text, markdown, code, shell commands, files, guidance]\n\n**Output Format:** [Markdown guidance with generated HTML, shell commands, and PNG/HTML output file paths.]\n\n**Output Parameters:** [1D]\n\n**Other Properties Related to Output:** [Uses 680px-wide HTML templates and screenshot generation for Xiaohongshu-style image posts.]\n\n## Skill Version(s):\n\n1.0.2 (source: server release metadata)\n\n## Ethical Considerations:\n\nUsers should evaluate whether this skill is appropriate for their environment, review any generated or modified files before relying on them, and apply their organization's safety, security, and compliance requirements before deployment."}],"languages":[],"docsSourceLabel":"CLAWHUB","editorialOverview":"将文章、技术文档等内容转换为适合小红书发布的 HTML 格式，生成封面图和内容截图，配好标题和正文摘要。 用户提供原始内容（Markdown 或纯文本）后，AI 生成适配小红书风格的多图 HTML 页面，并调用截图工具生成可直接发布的图片。 适用于：技术博客分享、知识干货、產品介绍、营销内容等。 Skill: Red book content creation Owner: wenhulove333 Summary: 将文章、技术文档等内容转换为适合小红书发布的 HTML 格式，生成封面图和内容截图，配好标题和正文摘要。 用户提供原始内容（Markdown 或纯文本）后，AI 生成适配小红书风格的多图 HTML 页面，并调用截图工具生成可直接发布的图片。 适用于：技术博客分享、知识干货、產品介绍、营销内容等。 Tags: latest:1.0.2 Version history: v1.0.2 | 2026-05-11T02:00:11.561Z | user - 新增对数学公式渲染支持，内容包含公式时自动引入 katex 并渲染 - 文档详细说明 katex 的引入方式、渲染方法及注意事项 - 增加公式容器与渲染示例代码（含 window.onload 建议） - 注意事项中新增“代码块格式规范”条目，细化代码展示标准","editorialQuality":{"score":100,"threshold":65,"status":"ready","wordCount":878,"uniquenessScore":57,"reasons":[]}},"media":{"evidence":{"source":"no-media","verified":false,"confidence":"low","updatedAt":"2026-10-10T15:58:30.194Z","emptyReason":"No screenshots, media assets, or demo links are available."},"primaryImageUrl":null,"mediaAssetCount":0,"assets":[],"demoUrl":null},"ownerResources":{"evidence":{"source":"unclaimed","verified":false,"confidence":"low","updatedAt":"2026-10-10T15:58:30.194Z","emptyReason":"This page has not been claimed by the agent owner."},"hasCustomPage":false,"customPageUpdatedAt":null,"customLinks":[],"structuredLinks":{"docsUrl":null,"demoUrl":null,"supportUrl":null,"pricingUrl":null,"statusUrl":null},"customPage":null},"relatedAgents":{"evidence":{"source":"protocol-neighbors","verified":false,"confidence":"medium","updatedAt":"2026-10-10T21:54:27.933Z","emptyReason":null},"items":[{"id":"8ebccd8e-3863-4187-8355-c3f14e1f9edf","entityType":"agent","canonicalPath":"/agent/iofficeai-aionui","slug":"iofficeai-aionui","name":"AionUi","description":"Free, local, open-source 24/7 Cowork app and OpenClaw for Gemini CLI, Claude Code, Codex, OpenCode, Qwen Code, Goose CLI, Auggie, and more | 🌟 Star if you like it!","url":"https://github.com/iOfficeAI/AionUi","homepage":"https://www.aionui.com","source":"GITHUB_REPOS","protocols":["MCP","OPENCLAW"],"capabilities":[],"safetyScore":100,"overallRank":70,"updatedAt":"2026-10-09T19:11:12.944Z","createdAt":"2026-02-25T03:38:16.584Z","downloads":null},{"id":"b917f68a-ebff-438e-84f8-3f4b2494c0bc","entityType":"agent","canonicalPath":"/agent/activepieces-activepieces","slug":"activepieces-activepieces","name":"activepieces","description":"AI Agents & MCPs & AI Workflow Automation • (~400 MCP servers for AI agents) • AI Automation / AI Agent with MCPs • AI Workflows & AI Agents • MCPs for AI Agents","url":"https://github.com/activepieces/activepieces","homepage":"https://www.activepieces.com","source":"GITHUB_REPOS","protocols":["OPENCLAW"],"capabilities":[],"safetyScore":100,"overallRank":70,"updatedAt":"2026-04-15T02:22:12.426Z","createdAt":"2026-02-25T03:38:12.412Z","downloads":null},{"id":"5cb26759-3a39-483f-94cf-276a98c13bb8","entityType":"agent","canonicalPath":"/agent/cherryhq-cherry-studio","slug":"cherryhq-cherry-studio","name":"cherry-studio","description":"AI productivity studio with smart chat, autonomous agents, and 300+ assistants. Unified access to frontier LLMs","url":"https://github.com/CherryHQ/cherry-studio","homepage":"https://cherry-ai.com","source":"GITHUB_REPOS","protocols":["MCP","OPENCLAW"],"capabilities":[],"safetyScore":100,"overallRank":70,"updatedAt":"2026-04-11T14:38:40.986Z","createdAt":"2026-02-25T03:38:19.379Z","downloads":null},{"id":"6f6582d0-5d76-4f0f-b81d-86520247950b","entityType":"agent","canonicalPath":"/agent/copilotkit-copilotkit","slug":"copilotkit-copilotkit","name":"CopilotKit","description":"The Frontend for Agents & Generative UI. React + Angular","url":"https://github.com/CopilotKit/CopilotKit","homepage":"https://docs.copilotkit.ai","source":"GITHUB_REPOS","protocols":["OPENCLAW"],"capabilities":[],"safetyScore":100,"overallRank":70,"updatedAt":"2026-03-25T09:50:57.846Z","createdAt":"2026-02-25T03:39:14.617Z","downloads":null}],"links":{"hub":"/agent","source":"/agent/source/clawhub","protocols":[{"label":"OpenClaw","href":"/agent/protocol/openclew"}]}}}