小红书配图生成器

将文本内容转化为小红书 9:16 竖版配图，提供专业设计配色方案。

使用流程

1. 配色选择（必须步骤）

向用户展示配色列表并等待选择：

请选择配色方案（输入编号，直接回车使用默认 02 Stamen Design）：
01 Pentagram(编辑风) | 02 Stamen Design(默认·数据诗学) | 03 iA(内容优先)
04 Fathom(科学叙事) | 05 Locomotive(沉浸黑) | 06 Active Theory(霓虹科技)
07 Field.io(算法美学) | 08 Resn(叙事交互) | 09 Jetset(概念极简)
10 Müller-Brockmann(瑞士网格) | 11 Build(当代极简) | 12 Sagmeister(快乐极简)
13 Lieberman(代码诗学) | 14 Raven Kwok(参数化) | 15 Ash Thorp(赛博诗意)
16 Territory(FUI科幻) | 17 Takram(日式思辨) | 18 Kenya Hara(空的设计)
19 Irma Boom(书籍建筑) | 20 Neo Shen(东方光影)

规则：

• 用户不选择 → 自动使用 02 Stamen Design
• 用户输入编号 → 使用对应配色

2. 配色方案速查表

| 编号 | 风格 | 文字色 | 背景色 | 强调色 | 辅助色 | 气质 | |:---:|:---|:---:|:---:|:---:|:---:|:---| | 01 | Pentagram | #1A1A1A | #F5F5F0 | #D4480B | #8C8C8C | 克制、编辑感 | | 02 | Stamen Design(默认) | #2D5016 | #F5F0E8 | #C75B39 | #8B9D83 | 温暖、数据感 | | 03 | iA | #1A1A1A | #FFFFFF | #0000EE | #666666 | 纯净、阅读优先 | | 04 | Fathom | #1B3A5C | #F0F2F5 | #E85D04 | #7A8B9A | 严谨、学术 | | 05 | Locomotive | #FFFFFF | #0A0A0A | #00D4AA | #333333 | 沉浸、电影感 | | 06 | Active Theory | #FFFFFF | #0A0A0F | #00F0FF | #1A1A2E | 未来、霓虹 | | 07 | Field.io | #1A1A1A | #F8F8F8 | #FF3366 | #E0E0E0 | 计算、几何 | | 08 | Resn | #2D1B4E | #F5F0E8 | #FF6B35 | #9B8AA5 | 故事、插画 | | 09 | Jetset | #000000 | #FFFFFF | #E30613 | #0066CC | 蒙德里安、艺术 | | 10 | Müller-Brockmann | #000000 | #FFFFFF | #FF0000 | #333333 | 客观、数学 | | 11 | Build | #1A1A1A | #FAFAFA | #D4A574 | #CCCCCC | 奢华、留白 | | 12 | Sagmeister | #1A1A1A | #FFF5F8 | #FF0066 | #00CCFF | 快乐、实验 | | 13 | Lieberman | #000000 | #FFFFFF | #333333 | #666666 | 纯粹、手绘 | | 14 | Raven Kwok | #000000 | #FFFFFF | #666666 | #CCCCCC | 递归、分形 | | 15 | Ash Thorp | #FFFFFF | #0D1B2A | #E85D04 | #1B3A5C | 电影、赛博 | | 16 | Territory | #FFFFFF | #0A0A0F | #FF9500 | #1A1A2E | 科幻、FUI | | 17 | Takram | #4A6741 | #F5F3EE | #8B9D83 | #C4B8A8 | 谦逊、日式 | | 18 | Kenya Hara | #8C8C8C | #FAFAFA | #E8E4DF | #F0F0F0 | 空、禅意 | | 19 | Irma Boom | #1A1A1A | #FFF0F3 | #E85D75 | #D4A017 | 书籍、编辑 | | 20 | Neo Shen | #1B3A5C | #F0EDE8 | #C9A96E | #8B9D83 | 水墨、东方 |

3. 生成插图

使用选定配色生成小红书 9:16 竖版插图（1080×1920）：

• 背景色 → 画布底色
• 文字主色 → 标题/正文
• 强调色 → 重点标注、按钮
• 辅助色 → 次要信息、边框

技术实现：

• 使用 HTML + CSS 手写样式
• Playwright 截图渲染为 PNG
• 字体：系统默认无衬线字体栈

4. 输出规范

• 格式：PNG
• 尺寸：1080×1920（9:16）
• 文字层级：72px/56px/48px/32px
• 每张字数：≤100字
• 表格都在一张图内
• 第一张图是标题加引语 最后一张图是总结加给人们的思考
• 文章的内容尽量让一个二级标题再一张图内
• 不保留HTML源文件

设计原则

1. 约束哲学 - 定义「为什么这样设计」而非「长什么样」
2. 内容优先 - 文字是主角，设计服务于信息传达
3. 概率性设计 - 好的约束产生多样化的高质量结果

何时使用

• 需要为小红书生成配图
• 用户说"做张图"、"生成插图"、"小红书配图"
• 文章完成后需要视觉化呈现

检查清单

• [ ] 已询问用户配色选择？
• [ ] 配色是否正确应用？
• [ ] 文字是否≤100字/张？
• [ ] 尺寸是否为 1080×1920？
• [ ] 是否删除HTML源文件？

---

版本: v1.1 更新日期: 2026-05-05