单文件 · 零依赖 · 数据只存本地

把公众号排版
变成可视化搭积木

84 个排版组件 × 5 套配色 = 420 种样式,点选即插入;填个主题就能按「黄金结构」自动生成文章骨架, 导出的纯内联 HTML 可直接粘贴进公众号编辑器。

无需安装、无需注册、无需联网;双击打开网页即可开始排版。

84排版组件
5配色主题
420组合样式
1个 HTML 文件
核心功能

排版这件事,交给组件和主题

从搭结构到改细节,再到导出粘贴,全流程都在一个页面里完成。

🧩

84 个排版组件

覆盖框架、标题、正文、重点块、互动、媒体、顶底、点赞等分类,从左侧点选即可插入,鼠标悬停可置顶、上移、下移、置底或删除。

🎨

一键换肤

墨青、靛蓝、暖橙、雾紫、竹绿五套配色一键切换。主题只换颜色、不换结构,同一账号长用一套更利于识别。

智能排版

填好主题,一键按「黄金结构」生成排版骨架:强开头 → 知识点(步骤/数据/对比)→ 三次互动 → 金句 → 结尾引导,生成后直接点字改内容。

🖊

所见即所得

每块文字都能直接点击修改,边改边看效果;字号可在 14px 至 16px 之间调节,正文观感随时对照。

🔤

选区格式

选中一段文字,可单独设置字号、字体色、背景色,也可以一键清除格式,回到干净的文字。

📥

导入与导出

导入 .md 大纲或草稿并自动解析成组件;支持导出纯内联 HTML、导出 .md,以及使用浏览器原生「另存为」保存页面。

撤销重做与自动保存

Ctrl+Z 撤销、Ctrl+Y 重做,误操作随时回退;编辑内容会自动保存到浏览器 localStorage,下次打开继续写。

🔒

零依赖 · 本地运行

整个编辑器就是一个 HTML 文件,浏览器打开即用,也可以部署到 GitHub Pages 在线访问;所有数据只存在本地,不上传任何服务器。

🖼

图片与媒体组件

内置头图 Banner、封面头图等媒体类组件,可导入图片放进排版里,图文混排一次搞定。

组件库

八个分类,覆盖一篇文章的骨架与血肉

从开头的导读卡到结尾的点赞引导,常见公众号版式都已有现成组件。

📰框架导读卡 / Banner / 系列导航
🔖标题多级标题与强调标题
📄正文段落 / 列表 / 说明文字
💡重点块金句 / 提示 / 引用强调
💬互动投票 / 引导 / 提问
🖼媒体图片 / 头图 / 图文组合
顶底关注引导 / 页脚声明
👍点赞点赞在看引导
配色主题

五套配色,一键换肤

同一套内容切换主题即可换风格,不用重排结构。

墨青学术知识 · 干货
靛蓝科技 · 职场技能
暖橙成长 · 方法论
雾紫文艺 · 哲思
竹绿生活 · 健康
使用流程

四步,从空白到可粘贴的成稿

1

打开编辑器

点「开始使用」进入编辑器页面,或用浏览器直接打开这个 HTML 文件。

2

定主题、选配色

需要一个骨架就填主题用智能排版生成,也可以从组件库里一块块点选搭建。

3

改文字、调细节

点击任意文字块直接编辑,选中文字单独调字号与颜色,配合撤销重做快速试版本。

4

导出粘贴

导出纯内联 HTML 复制进公众号编辑器即可;也可导出 .md 留存,或另存为独立网页。

📋

为什么粘贴到公众号不掉样式

导出的是纯内联样式代码,可直接粘贴进公众号编辑器、有一云、135、秀米等平台。微信会剥离 <style> 与 class,本工具在导出时已规避这一行为。

常见问题

开始前你可能想知道

需要安装或者登录吗?

都不需要。它是单文件、零依赖的网页工具,浏览器打开即可使用,没有账号体系,也没有安装步骤。

我写的内容会被上传吗?

不会。排版内容只保存在你自己浏览器的 localStorage 里,不会上传到任何服务器。

智能排版生成的是什么?

它会按「黄金结构」生成一套文章骨架:强开头 → 知识点(步骤 / 数据 / 对比)→ 三次互动 → 金句 → 结尾引导,生成后你直接点字改成自己的内容即可。

可以换成自己的风格吗?

可以。先一键换肤切换五套配色中的任意一套,再对选中文字单独设置字号、字体色和背景色,或清除格式回到纯文字。

能把它放到自己的网站上吗?

可以。项目已开启 GitHub Pages,根目录的 index.html 就是站点入口;整个编辑器也是单个 HTML 文件,放进任意静态空间即可访问。

现在就开始排版

打开编辑器,选一套配色、插入第一个组件,剩下的交给它。

开始使用 →

所有内容仅保存在本地浏览器,随时可关,随时可继续。