不用PS不用设计软件,浏览器就能做公众号封面-夜雨聆风

不用PS不用设计软件,浏览器就能做公众号封面

一个开发者把他做公众号封面和 X 题图的工具开源了。

纯 HTML，浏览器打开就能用。不装 Node.js，不装 Python，下载来双击就跑。

我实际测了一下，下面是结果。

先说结论：X题图最好用

article-tools，GitHub上刚开源，MIT 协议。三个工具——排版、封面生成、二维码。这篇只聊封面生成器（cover.html），另外两个以后单独写。

项目地址：

https://github.com/eternityspring/article-tools

在线预览：

https://eternityspring.github.io/article-tools/

我直接在浏览器里打开了 cover.html。双击，没有 npm install，没有启动服务。打开就能用。

然后我分别用它做了 X 题图、公众号文章题图、公众号封面。

X 题图——这个我最满意

X 的题图是 1500×500px 横版。我选了渐变背景配极简几何装饰，填上标题文字，导出。

几何装饰的 CSS 写得挺讲究，线条和色块的位置不是随便摆的，有点设计功底在。我之前做 X 题图一直是纯文字+纯色，换了这个之后同事问我是不是换了设计工具。说实话，比 Figma 快太多了。

公众号文章题图——够用

900×383px。我试了赛博朋克风格，霓虹色+网格线效果。做出来看着还可以，但比 X 那张差点意思——可能是因为文章题图比例窄，装饰元素的展示空间不够大。

不过如果你现在的题图也是纯色背景，换这个工具确实能直接升级。从”没有设计感”到”有点设计感”这个跨度，它撑得住。

公众号封面——勉强及格

公众号封面（2.35:1）我试了 AI 球体风格配深色背景。说实话这张我犹豫要不要放进来。球体的 CSS 渲染在 Chrome 上看着还行，但换到 Edge 上光影效果差了一点。如果你对封面要求比较高，这个可能还不够。

配色不是选预设色，是给了一个面板

纯色、线性渐变、径向渐变三种模式，每种可以自己填色值。我有品牌色，直接输进去就能用，和预设装饰风格不冲突。

我拿 #FF6B35 试了一下，配合几何装饰效果很自然，没有”品牌色和装饰风格打架”的问题。

装饰风格是纯 CSS，能自己改

极简几何、赛博朋克、AI 球体——三种风格，没有图片资源，全是 CSS 画的。这意味着你可以打开开发者工具直接改参数。我在 F12 里调了几次圆角和间距，比在工具界面上点来点去方便。

“AI 预设存档”——让 AI 帮你定风格

你用自然语言描述想要的封面（”深蓝底色、金色文字、暗色几何、科技感”），AI 帮你生成对应的参数配置，保存为新预设。下次打开一键加载。

说白了就是你告诉 AI 你要什么，它帮你调好，你下次直接用。不用懂 CSS，不用会设计。

不过这个功能我还没实际跑通——因为它需要你自己搭配 AI 来用，工具本身不带 AI。我理解的是作者设计了这个预设格式的接口，方便你用任何 AI 工具生成参数后导入。想法挺好的，但目前更像是一个”接口”而不是”功能”。

第一步：git clone 或者去 GitHub下载 ZIP。

第二步：解压，找到 cover.html，双击打开。

没了。

打开之后选尺寸、选风格、调颜色、填标题、导出。我自己测下来，做过一两张之后基本半分钟一张。第一张会慢一些，主要是在试哪个风格好看。

字体和背景纹理这两样加上之后，这个工具的适用范围会大很多。现在主要是技术博主在用，字体和纹理到位之后，非技术类的公众号也能直接拿来用。

项目地址：

https://github.com/eternityspring/article-tools

在线预览：

https://eternityspring.github.io/article-tools/

开源协议：MIT