我打造了一个免费负片图像转换器，永不上传你的文件

Source: Dev.to

大多数在线图像反转工具的问题

大多数在线工具的做法都一样：它们把你的照片上传到服务器，展示广告，要求你注册，并让你在担心文件去向的同时等待。对于一个简单的数学运算来说，这一切都是多余的。

颜色反转的公式只有一个：255 减去原始像素值。你的浏览器可以在毫秒内完成——根本不需要服务器。

我做了什么

我在 stackflowtools.com 上构建了一个免费负片图像转换器。

它 100 % 在浏览器中使用 HTML Canvas API 运行，所以你的图像永远不会离开你的设备。

功能

• 反转 JPG、PNG、WebP 和 GIF 文件，最大支持 20 MB
• 上传后立即处理图像
• 对透明 PNG 保留 alpha 通道
• 可调节亮度、对比度和饱和度
• 导出为 PNG（无损）或 JPG（体积更小）
• 零注册要求

数学原理

每个像素有三个颜色通道：红、绿、蓝。每个通道的取值范围是 0 到 255。

要反转一个像素，只需用 255 减去每个通道的值。

示例

• 白色像素 (255, 255, 255) → 黑色 (0, 0, 0)
• 红色像素 (255, 0, 0) → 青色 (0, 255, 255)

任何颜色都会在色轮上翻转到其相反色。该计算会一次性在图像的每个像素上执行；在现代浏览器中，无论文件大小如何，都只需毫秒级时间。

为什么客户端处理很重要

当工具在服务器上处理你的图像时，文件会在互联网上传输，存放在别人的机器上，并（希望）随后被删除。

当处理在浏览器中进行时：

• 文件永不移动
• 没有人能看到它
• 没有存储、没有日志、没有风险
• 页面加载后即可离线使用

这对人物照片、文档以及任何个人内容尤为重要。

谁会使用它

负片图像转换的使用频率可能超出你的想象：

• 设计师将白色 logo 翻转以适配深色背景
• 摄影师为作品添加复古胶片负片效果
• 学生研究医学 X 光片时，反转对比度能显示更多细节
• 可访问性测试人员检查针对视觉障碍的对比度

使用方法

1. 访问工具页面，上传图片或直接拖拽。
2. 反转后的图像会自动显示；如有需要可调节亮度或对比度。
3. 选择 PNG 或 JPG，点击 Download（下载）。

整个过程不到十秒。

技术实现

该工具使用 HTML Canvas API：

// Get pixel data
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
const data = imageData.data;

// Invert colors
for (let i = 0; i  {
  // trigger download
}, 'image/png');

处理部分未使用任何库或框架——纯浏览器 API。

试一试

免费负片图像转换器——无需注册、无需上传、无广告。

如果你正在构建图像工具或从事基于浏览器的文件处理，欢迎在下方提出任何问题。