| name | xiaohongshu-template |
| description | 小红书图文模板生成器:根据活动/商品/清单数据,生成莫兰迪手账风 HTML 模板,可直接截图上传小红书。 |
| version | 1.0.0 |
| author | magnes-studio |
| metadata | {"hermes":{"tags":["xiaohongshu","小红书","infographic","template","图文模板","morandi"],"related_skills":["baoyu-infographic","claude-design"]}} |
小红书图文模板生成器
为小红书创作者生成可截图上传的图文模板 HTML 文件。
适用场景
- 市集/活动推荐合集
- 商品测评对比
- 旅行攻略清单
- 美食探店合集
- 任何需要「一列 N 个」卡片式展示的内容
设计风格
- 比例: 3:4(小红书图文标准,375x500px)
- 风格: 莫兰迪手账风(morandi-journal)
- 色调: 米色背景 + 灰绿标题 + 赭石重点
- 装饰: Washi 胶带、手绘波浪线、角落 emoji
使用方法
方式一:直接调用(推荐)
提供数据,生成模板文件:
生成小红书图文模板:
- 标题: 上海三月市集攻略
- 副标题: 3个免费面包市集
- 活动列表:
1. 外滩国际面包节 | 3月14-15日、21-22日 | BFC外滩枫径 | 免费 | 200+面包店
2. 超级美好面包节 | 3月12-15日 | 上海万象城 | 免费 | 150家品牌
3. 海派法式生活节 | 3月13-15日 | 新天地时尚二期 | 免费 | 生活方式市集
方式二:使用模板文件
- 复制
templates/base.html 到工作目录
- 修改其中的数据占位符
- 浏览器打开,F12 → Device Toolbar → 375x500
- 截图保存,上传小红书
模板结构
xiaohongshu-template/
├── SKILL.md # 本文件
├── templates/
│ └── base.html # 基础模板(可直接编辑复用)
└── references/
└── style-guide.md # 设计规范参考
数据格式
生成模板时需要提供:
| 字段 | 说明 | 示例 |
|---|
| title | 主标题 | 上海三月市集攻略 |
| subtitle | 副标题 | 3个免费面包市集 周末逛起来 |
| items | 条目列表(3-5个最佳) | 见下 |
每个 item 需要:
- name: 名称
- time: 时间
- location: 地点
- price: 门票/价格(通常写「免费」或具体金额)
- highlight: 亮点描述(可包含数字强调)
- icon: emoji 图标(🥐🍞☕ 等)
输出
- HTML 文件路径(默认保存到
/tmp/xiaohongshu-output/)
- 使用说明(如何截图上传)
自定义选项
| 选项 | 默认值 | 可选值 |
|---|
| 比例 | 3:4 | 1:1, 4:3, 9:16 |
| 风格 | morandi-journal | 可扩展 |
| 卡片数量 | 3 | 2-5 |
| 显示标签 | 否 | 是/否 |
| 显示页码 | 否 | 是/否 |
注意事项
- 小红书图文建议 3-5 个条目,太多会拥挤
- 截图时用浏览器开发者工具锁定 375x500 尺寸
- 字体已优化到最小可读大小,不建议再缩小
- 免费标签统一显示为「FREE」绿色标签
示例调用
用 xiaohongshu-template 生成一个咖啡探店合集:
- 标题: 上海春日咖啡地图
- 副标题: 5家值得打卡的独立咖啡馆
- 店铺:
1. 三顿半原力飞行 | 愚园路 | 人均35 | 特调咖啡 | ☕
2. Ops Cafe | 太原路 | 人均40 | 季节限定 | 🍵
3. Metal Hands | 永嘉路 | 人均30 | 铁手招牌 | 🥛