Guizang Social Card Skill 是一个面向 Claude Code、Codex 等 Agent 环境的开源图文卡片技能，核心用途是把文章、文案、截图、产品笔记、字幕或照片，快速生成适合 小红书图文组图 和 公众号封面对 的视觉卡片。

项目内置了两套明确的视觉系统：一套是偏叙事、生活方式和氛围表达的 Editorial 电子杂志风，另一套是偏信息结构、数据表达和产品测评的 Swiss 瑞士国际主义风格。使用 单文件 HTML + Playwright 渲染 PNG 的方式出图，不依赖复杂前端构建链。

【产品功能】

• 双视觉系统：项目内置 Editorial 和 Swiss 两套风格系统，共用同一套图文生产工作流。前者适合旅行、阅读、影视、个人观察等更重氛围与叙事的内容；后者适合产品测评、教程、方法论、AI 工具和数据拆解这类更强调结构的信息表达。

• 三种固定画板尺寸：Skill 预设了三种常见社交内容尺寸：1080×1440 的小红书 3:4 图文、2100×900 的公众号 21:9 头图，以及 1080×1080 的公众号 1:1 分享卡。

• 28 个版式骨架：总共提供 28 个版式骨架，其中 Editorial 16 个、Swiss 12 个，覆盖 Image-Led Cover、Pipeline、Before/After、KPI Tower、H-Bar Chart、Matrix + Hero 等多种版式类型。

• 10 套主题预设：包括 Editorial 的 6 套色彩主题和 Swiss 的 4 套锚点色主题，例如 IKB Klein Blue、Lemon、Safety Orange 等。

• 自动取图与来源记录：当用户没有提供图片时，Skill 会按 Unsplash → Pexels → Flickr CC → Wallhaven → 直接搜索 的优先级去取图，并把素材落到本地，同时自动写出 SOURCES.md 记录来源。

• 截图包装与地图组件：项目内置了 9 张真实材质背景图，以及 .frame-shot、.device-browser、.device-phone 等截图包装类，还支持基于 MapLibre + OSM 的地图组件，可做多 pin 连线，适合旅行攻略、路线说明或截图型教程内容。

• 7 步结构化工作流：Skill 会让 Agent 按 7 步完成工作：先确认平台、风格、素材和用户图片，再选主题、选版式、准备图源、渲染输出，最后交付和迭代。

• 适用场景：推荐场景包括：小红书图文组图、公众号封面对、朋友圈封面、视频号封面、教程拆页、数据回顾、旅行攻略、产品测评、截图说明；不适合横向翻页 PPT、长视频生成、纯修图和无版式诉求的纯文字编辑。