解决什么

中文社交媒体内容创作者面临三个痛点:小红书图文需要 3:4 竖版多图排版,公众号封面需要 21:9 头图与 1:1 分享卡配对,而 Canva/创客贴等工具需要手动调整模板、反复试错配色与版式。该项目将专业编辑设计规则编码为 AI Agent 可执行的结构化工作流,输入文章或文案后自动完成版式选择、配图检索、排版渲染全流程,输出符合平台规范的 PNG 图片。

核心技术路径是用单文件 HTML + CSS Grid 精确控制版式,通过 Playwright 无头浏览器渲染为高质量图片,配合 6 条硬性校验规则(溢出检测、字号上限、底部碰撞等)保证输出质量。

为何火

3157 stars 的热度来自三个维度:首先是垂直场景精准命中 —— 小红书与公众号是中文内容生态的两大流量入口,图文封面质量直接影响点击率,但市面缺少针对这两个平台尺寸与审美的自动化工具;其次是AI Agent 原生设计,不同于传统设计工具需要人工操作,该项目将排版知识结构化为 Agent 可理解的 Markdown 文档(28 个版式骨架、10 套主题预设、11 个品类适配指南),Claude Code 等工具可直接调用;第三是美学规则硬编码,通过禁止自定义颜色、强制网格对齐、自动遮罩叠加等约束,避免非设计人员产出"PPT 风"劣质图文。

项目在 GitHub Topics 标注了 xiaohongshu、rednote、wechat 等中文平台关键词,精准触达目标用户群体。

核心功能

双视觉系统共用工作流:Editorial(电子杂志风)适合叙事与生活方式内容,模仿 Monocle/Kinfolk 的克制排版;Swiss(瑞士国际主义)适合数据与产品测评,采用网格、单一锚点色、极致字号对比。两套系统共享 28 个版式骨架(Editorial 16 个如 Image-Led Cover、Pipeline;Swiss 12 个如 KPI Tower、H-Bar Chart)。

自动化图源工作流:优先使用用户上传图片,无图时按 Unsplash → Pexels → Flickr CC → Wallhaven → 直接搜索的优先级自动检索,下载到本地并生成 SOURCES.md 版权记录。支持 MapLibre + OSM 真实地图瓦片,适合旅行攻略类内容。

质量保证机制:validate-social-deck.mjs 脚本基于 Playwright 真实渲染测量,检测 6 类问题:内容溢出、字号超限、底部碰撞、横带密度不足、框架溢出、Swiss 风格违规(如粗体滥用)。配合 references/image-overlay.md 的遮罩规则与人脸避让指南,确保满铺图的文字可读性。

平台适配:.poster.xhs 生成 1080×1440 小红书 3:4 图文,.poster.wide 生成 2100×900 公众号 21:9 头图,.poster.square 生成 1080×1080 公众号 1:1 分享卡,三种画板可混合使用保持视觉一致性。

安装

方式一(推荐):

npx skills add https://github.com/op7418/guizang-social-card-skill --skill guizang-social-card-skill

方式二(直接对话): 复制以下文本发给 Claude Code/Cursor:

帮我安装 guizang-social-card-skill。请把 https://github.com/op7418/guizang-social-card-skill 克隆到 ~/.claude/skills/guizang-social-card-skill,安装完成后检查 SKILL.md、assets/、references/ 是否存在。

方式三(手动):

git clone https://github.com/op7418/guizang-social-card-skill.git ~/.claude/skills/guizang-social-card-skill

安装后对 Agent 说"帮我做一套小红书图文"或"生成公众号封面对"即可触发。渲染依赖 Node.js 与 Playwright,首次运行会自动安装浏览器二进制文件。

适合谁

内容创作者与运营人员:小红书博主、公众号运营、自媒体从业者,需要批量产出符合平台规范的图文封面,但缺乏专业设计能力或不想在 Canva 反复调整模板。

AI Agent 重度用户:已在使用 Claude Code、Codex 或 Cursor 处理文本工作流的用户,希望将图文设计环节也纳入自动化流程。

不适合:需要 OOTD 实拍、梦核调色、胶片质感等强依赖摄影与后期的细分赛道;横向翻页 PPT 需求(应使用姊妹项目 guizang-ppt-skill);纯图片修图或无版式诉求的场景。

中国大陆用户注意:图源服务(Unsplash/Pexels)可能需要稳定网络环境,建议准备自有图片库或使用 Wallhaven 等国内可访问源。

社区评价

暂无足量社区公开讨论,以下为基于项目本身的中立评估:

该项目在技术实现上展现了较高的工程化水平,将传统设计工具的"所见即所得"交互转化为"规则即代码"的 Agent 工作流。通过 references/ 目录下的 11 个 Markdown 文档(如 layout-seeds.md 定义 28 个版式、category-cookbook.md 给出 11 个品类适配策略),将隐性设计知识显性化为 AI 可理解的结构化输入,这是其核心创新点。

291 个 forks 表明有实际使用需求,但项目创建时间较短(2026 年 5 月),长期稳定性有待观察。AGPL-3.0 协议要求衍生作品开源,商业化使用需注意合规性。4 个 open issues 数量适中,维护者响应及时(最近提交 12 天前)。

潜在争议点在于美学独裁设计哲学 —— 项目明确禁止用户自定义颜色(只能从 10 套预设选择),这在保证输出质量的同时也限制了创意自由度,适合追求"足够好"而非"完全定制"的场景。

选型对比

vs Canva/创客贴(商业工具):

Canva 优势:所见即所得界面、海量模板、云端协作、中文字体库丰富
本项目优势:AI Agent 自动化、版式规则硬编码避免低质输出、开源免费、可本地运行保护内容隐私
取舍:Canva 适合需要精细调整或团队协作的场景;本项目适合批量生产、追求一致性美学、已有 AI 工作流的个人创作者

vs 同类开源工具(如 Satori、og-image):

Satori 等工具聚焦 Open Graph 社交卡片(1200×630),主要服务网页分享场景
本项目专为中文平台(小红书 3:4、公众号 21:9+1:1)设计,内置符合中文阅读习惯的版式与配色
取舍:通用 OG 工具适合技术博客等横向场景;本项目垂直解决中文内容生态的特定需求

vs 姊妹项目 guizang-ppt-skill:

PPT skill 解决横向翻页演讲场景,支持动画与交互
本项目解决静态信息流图文,优化单屏信息密度与视觉冲击力
两者共享美学语言但独立维护,可根据输出介质选择

已知坑

图源依赖境外服务:Unsplash/Pexels 在中国大陆访问不稳定,Wallhaven 虽可访问但图库偏二次元与壁纸风格,不适合所有品类。建议准备自有图片库或配置代理。

品类能力圈有限:references/category-cookbook.md 明确标注 OOTD 实拍流、梦核、仿胶片等强依赖摄影的细分赛道为"能力圈外",Agent 会主动拒绝而非强行生成低质内容。

字体版权风险:项目默认使用系统字体,中文环境依赖思源黑体等开源字体。商业使用需自查字体授权,特别是 Editorial 风格可能需要衬线字体(如思源宋体)。

校验脚本性能开销:validate-social-deck.mjs 需启动 Playwright 浏览器实例,单次校验耗时 10-30 秒。项目设计为"默认不自动跑",用户需主动触发,避免迭代时的等待时间。

AGPL 协议传染性:若将本项目集成到 SaaS 服务,需开源整个服务端代码。个人使用或内部工具无影响,但商业化需评估协议兼容性。