🎨

HTML 可视化编辑器

纯前端单文件 HTML 可视化编辑器——拖入任意 HTML 文件,点选元素即可所见即所得地修改文字、样式、布局。零依赖,双击即用,不联网也能跑。
HTML 可视化编辑器界面

△ 所见即所得编辑界面,左侧元素树、右侧样式面板、实时预览,点选即改

技术栈

JavaScriptTerserES5Playwright

核心功能

  • 拖入或选择 HTML 文件直接进入编辑
  • 点选页面元素直接修改文字内容
  • 样式面板:文字/背景/间距/尺寸/定位/边框/排版/布局/阴影/效果/变换
  • 查找与替换(Ctrl+F,支持全部替换)
  • 插入图片(按钮 + Ctrl+V 粘贴截图)
  • 右键菜单:复制/删除/上移/下移元素
  • 页面缩放 50%~200%(Ctrl+= / Ctrl+-)
  • 保存到本地(首次选路径,后续自动覆盖)
  • 导出时自动清除编辑器注入代码
  • Win7 Chrome 109+ / Win11 Chrome / Firefox 兼容
最新版本:v1.0.0
更新日期:2026-06-04
📥 下载单文件版
文件大小:82 KB · 双击即用 · 零依赖 · 纯前端