DrawStampUtils 实测：1.5k 星的 JS 印章绘制库，前端生成公章不求人

做企业级应用的开发者应该都遇到过这个需求：系统里需要电子签章功能，用户提交合同或审批单之后，要自动盖上一个带公司名的电子印章。

最常见的做法是让设计师做一套印章图片，不同公司用不同的图片。但问题来了——每新增一个客户就要重新做图，而且印章上的公司名、编号这些信息是动态的，静态图片根本不够用。

DrawStampUtils 这个库就是来解决这个问题的。1.5k 星，TypeScript 写的，纯前端用 Canvas 绘制各种风格的印章。不需要设计师，一行代码就能生成一个像样的公章。

它解决了什么问题

核心就一件事：用代码在前端生成各种样式的印章。

具体场景：

• 电子合同系统需要动态生成带公司名的签章
• 内部审批流需要在通过时自动盖章
• 模拟演示系统需要生成逼真的印章效果
• 需要批量生成不同公司、不同编号的印章样本

用代码生成的好处显而易见：公司名、编号、有效期这些信息可以动态传入，新增客户不需要重新设计，一套代码服务所有场景。

核心功能

圆形公章 最常见的公章样式——圆形外框，中间五角星，外圈环绕公司名。支持自定义：

• 外圈公司名文字（自动环形排列）
• 中间五角星大小和颜色
• 底部编号或横线
• 边框粗细和颜色
• 文字字体和字号

我试了一个”北京某某科技有限公司”的印章，文字环形排列的效果很自然，字号会根据文字长度自动调整，不会溢出。

椭圆形章 适用于某些特定场景的椭圆印章。可以设置长轴、短轴比例，文字沿着椭圆路径排列。适合财务章、合同章等样式。

方形章 简单的方形边框印章，内部自定义文字。适合做”作废""已审核""复印无效”这类功能性印章。

细节控制

• 做旧效果：可以添加噪点、划痕、模糊等效果，让生成的印章看起来不像” freshly printed”
• 颜色调整：支持红色、蓝色、紫色等常见印章颜色
• 边线样式：实线、双线、点线等多种边框风格
• 文字压缩：长公司名自动压缩字间距，确保能完整显示在圆环内

导出格式 生成结果可以直接导出为：

• Canvas（前端直接显示）
• PNG 图片（可下载保存）
• SVG 矢量图（无限缩放不失真）
• Base64 字符串（可直接嵌入 HTML/CSS）

快速上手

import { DrawStampUtils } from 'drawstamputils';

// 创建印章实例
const stamp = new DrawStampUtils({
  canvas: document.getElementById('stamp-canvas'),
  width: 300,
  height: 300
});

// 绘制圆形公章
stamp.drawCircleStamp({
  companyName: '北京某某科技有限公司',
  code: '110108012345678',
  color: '#ff0000',
  fontSize: 14,
  borderWidth: 2,
  starSize: 30,
  showNoise: true  // 添加做旧效果
});

// 导出 PNG
const pngData = stamp.toPNG();
// 导出 SVG
const svgData = stamp.toSVG();

npm 安装：

npm install drawstamputils

技术栈：

• TypeScript
• Canvas 2D API
• 无第三方依赖

实际使用场景

场景一：电子合同签章 用户在线签署合同后，系统根据合同信息动态生成带有双方公司名的电子印章，盖在合同末尾。比用静态图片模板灵活得多，而且每次盖章的信息都是准确的。

场景二：内部审批流程 报销单、请假条、采购申请等审批通过后，自动盖上”已审核”和部门章。不同部门用不同样式的印章，一眼就能看出审批来源。

场景三：模板演示 做 SaaS 产品的 demo 环境时，需要模拟真实企业的印章效果。用 DrawStampUtils 可以批量生成各种公司的印章样本，demo 看起来更真实。

场景四：印章管理工具 一些中小企业没有专门的印章设计软件，用这个库可以快速生成公司印章的电子版，用于文档处理和归档。

优点和槽点

真香的点：

• 纯前端实现，不需要后端支持，响应速度快
• TypeScript 支持好，类型定义完整
• 无第三方依赖，引入成本低
• 印章效果逼真，环形文字处理得很自然
• 支持做旧效果，生成的印章不会一眼假
• 导出格式丰富，Canvas/PNG/SVG/Base64 都有
• 开源免费，可以按需二次开发

想吐槽的地方：

• 字体依赖系统字体，不同平台显示效果可能不一致
• 复杂的印章样式（比如带国徽的正式公章）不支持
• 做旧效果参数有限，不能精细控制
• 中文长公司名的自动排版偶尔有小问题，超长名字会挤在一起
• 没有内置的印章合法性校验（比如编号格式检查）
• 文档比较简单，高级用法需要看源码
• 项目维护频率一般，issue 响应不快

和类似方案怎么选

方案	优点	缺点	适合场景
DrawStampUtils	纯前端、无依赖、轻量	样式有限	简单电子签章
设计师出图	效果最好、最专业	成本高、不灵活	正式法律文件
后端生成(PIL)	功能更强、字体可控	需要服务器资源	高并发场景
第三方签章服务	合规、有法律效力	收费、数据上云	正式电子签约

DrawStampUtils 的定位很明确：轻量级的纯前端印章生成，适合对法律效力要求不高、但需要视觉效果不错的内部系统。

如果是正式的法律文件签署，还是建议用有法律效力的第三方电子签章服务（如 e 签宝、法大大）。但对于内部审批、演示 demo、非正式文档这些场景，DrawStampUtils 完全够用，而且成本低得多。

总结

1.5k 星对于一个这么垂直的工具库来说不算少了。DrawStampUtils 解决了一个很具体的问题：让前端开发者能在浏览器里生成逼真的印章效果。

它不是专业的设计工具，也不是合规的电子签章方案。它是一个开发者友好的代码库，用最小的成本解决”动态生成印章”这个常见但容易被忽视的需求。

对于需要电子签章功能但预算有限、且对法律效力要求不高的项目，DrawStampUtils 是一个性价比很高的选择。几行代码就能生成一个像样的印章，省去找设计师、做切图、维护多套模板的一系列麻烦。

---

关于作者

柳钉鱼，全栈开发者，GitHub 重度用户。过去 3 年 Star 了 900+ 仓库，这里只写我真正用过或深度调研过的工具。

📧 发现好工具想推荐？发邮件到 [email protected]