guanghulab/image-studio

🎨 封面工作室 — 语言驱动排版设计

输入文字，自动排版，生成封面。 不需要 GPU · 不花一分钱 · 一行命令部署。

这是什么

一个纯 HTML/CSS 排版渲染的封面生成工具。和 AI 生图工具不同——它不做像素生成，而是做排版设计。

你告诉它内容和风格，它自动分析、配色、排版、渲染成图。

为什么做这个

市面上的封面工具都依赖 AI 绘画模型（DALL-E / Stable Diffusion），需要 GPU、API 密钥、付费额度。

这个工具：

• 零成本 — 不需要任何 API 密钥
• 极轻量 — 2GB 内存就能跑
• 可部署 — 一行命令搭到自己服务器上
• 可扩展 — 模板注册表机制，加新模板不改核心代码

快速开始

部署

# 1. 克隆代码
git clone https://guanghulab.com/code/bingshuo/guanghulab.git
cd guanghulab/image-studio

# 2. 安装依赖
npm install

# 3. 启动服务
node server.js

# 4. 打开浏览器
# http://localhost:3912

Docker

docker run -d -p 3912:3912 --name cover-studio ghcr.io/bingshuo/cover-studio

当前支持的模板

模板	尺寸	说明
📕 小红书封面	1080×1440	3:4 竖版封面 · 5种预设风格
📋 活动海报	1080×1920	9:16 海报（即将接入）
📱 社交卡片	1080×1080	1:1 社交分享（即将接入）

预设风格

• 科技蓝 — 深色背景 + 蓝色调 · 适合技术教程
• 奶油暖调 — 浅色背景 + 暖色系 · 适合生活分享
• 极简黑白 — 纯白背景 + 黑色文字 · 适合正式内容
• 玫瑰粉调 — 粉色系 · 适合女性向内容
• 文艺绿植 — 绿色系 · 适合文艺/自然内容

架构

用户输入文字
    ↓
内容分析引擎 (config.js)
    · 检测内容类型：教程/金句/通知/...
    · 检测情绪：温暖/正式/文艺/...
    ↓
模板注册表 (templates/registry.js)
    · 选择模板 + 推荐预设风格
    · CSS 变量驱动配色
    ↓
模板渲染 (templates/xiaohongshu.js)
    · 纯 HTML + CSS 排版
    · 三种布局：标准/封面/金句
    ↓
Puppeteer 截图 (renderer.js)
    · Chrome headless 渲染
    · 输出 1080p 高清 PNG

添加新模板

1. 创建 templates/your-template.js，导出渲染函数
2. 在 templates/registry.js 注册
3. 核心代码零改动 ✅

// templates/registry.js
export const TEMPLATE_REGISTRY = {
  // ...已有的模板...
  
  'your-template': {
    id: 'your-template',
    name: '你的模板名',
    sizes: { width: 1080, height: 1920 },
    presets: [/* 预设风格 */],
    render: yourRenderFunction,  // ← 这里挂上
  },
}

API

GET /api/templates

获取所有可用模板列表。

POST /api/generate

生成封面图片。

{
  "templateId": "xiaohongshu",
  "presetId": "tech",
  "title": "零基础手搓AI封面",
  "body": "- 第一点\n- 第二点",
  "layout": "default"
}

返回：

{
  "success": true,
  "url": "/output/cover_1712345678.png"
}

开源协议

MIT © 光湖 · 铸渊

链接

• 在线体验：https://cover.guanghulab.com
• 代码仓库：https://guanghulab.com/code/bingshuo/guanghulab
• 小红书：@冰朔