无需登录 数据私有 本地保存

图片高斯模糊工具 - Canvas在线模糊效果

18
0
0
0

图片高斯模糊工具

Canvas 在线模糊效果 · 实时预览 · 一键下载

拖拽图片到此处

或点击上传 · 支持 JPG / PNG / WebP / AVIF

最大处理尺寸 2000px，文件大小不限
快捷示例： 山景示例 风景示例 自然示例 动物示例 建筑示例
原图
模糊效果
8 px
快速设置：
当前无图片，请上传或选择示例

常见问题与知识点

高斯模糊（Gaussian Blur）是一种图像平滑处理算法，以数学家高斯的名字命名。它通过对图像中每个像素及其周围像素进行加权平均来计算新像素值，权重由高斯函数（正态分布曲线）决定。离中心像素越近的像素权重越大，越远的权重越小，从而产生自然柔和的模糊效果。本工具使用 Canvas 原生的 filter 属性实现，底层由浏览器 GPU 加速渲染。

模糊半径决定了模糊的影响范围。在数学上，它对应高斯函数的标准差 σ（sigma）。半径越大，参与加权平均的像素范围越广，图像就越模糊。例如：3px 半径适合轻微柔化皮肤纹理；10px 半径能产生明显的朦胧效果；30px 以上则几乎完全模糊掉所有细节，适合背景虚化或抽象艺术效果。

Canvas filter（本工具使用的方式）在绘制阶段就将模糊应用到图像数据上，导出的图片包含模糊效果，可以直接下载使用。CSS filter 仅影响元素在页面上的显示效果，不改变原始图像数据，无法导出带模糊的图片。对于需要保存模糊图片的场景，Canvas filter 是正确的选择。此外，两者在极端半径下的渲染细节可能略有差异，Canvas filter 通常更接近图像处理软件的效果。

这是因为模糊算法需要读取超出图片边界的像素来进行加权平均。当图片边缘没有足够的像素数据时，浏览器会假设边界外的像素为透明（alpha=0），导致边缘混合了透明色而变暗或变透明。本工具在显示时使用 clip 裁剪保持视觉整洁，下载时采用扩展画布技术，在图片周围添加 padding 空间来容纳模糊溢出，确保边缘模糊完整自然。

盒子模糊对周围所有像素使用相同权重，计算简单快速但效果生硬。而高斯模糊使用正态分布权重，产生更自然平滑的过渡。多次叠加盒子模糊可以逼近高斯模糊的效果（通常3次即可），这也是很多图像处理库采用的优化手段。浏览器原生的 blur filter 底层通常实现了高效的高斯近似算法。

支持浏览器能解码的所有常见格式：JPEG、PNG、WebP、AVIF、BMP、GIF（静态帧）等。下载默认使用 PNG 格式以确保无损保存模糊效果。处理后的图片分辨率与原图一致（最大 2000px），不会因模糊操作而损失像素密度。如果原图是 JPEG 等有损格式，建议使用较高质量的压缩参数。

应用场景非常广泛：隐私保护（模糊人脸、车牌、敏感信息）；背景虚化（模拟浅景深效果，突出主体）；UI 设计（毛玻璃效果、弹窗背景）；图像降噪（去除轻微噪点）；艺术创作（梦幻柔焦、抽象风格）；水印去除预处理；边缘检测的前置步骤（Canny 算法常用高斯模糊预处理）。

处理速度主要受图片尺寸和模糊半径影响。大尺寸图片（如 4000×3000 像素）结合大模糊半径时，计算量会显著增加。本工具自动将图片限制在2000px以内，平衡质量与性能。如果仍需优化：可以先缩小图片再模糊然后放大（近似效果），或使用更小的模糊半径。现代浏览器的 GPU 加速通常能在 1-2 秒内完成常规图片处理。

二维高斯函数公式为：G(x,y) = (1/(2πσ²)) × e^[-(x²+y²)/(2σ²)]，其中 σ 是标准差（控制模糊程度），(x,y) 是相对中心像素的坐标。在实际计算中，会先构建一个卷积核（kernel）矩阵，矩阵大小通常为 (6σ+1)×(6σ+1)，然后用该核对图像进行卷积运算。为优化性能，二维高斯卷积可拆分为两次一维卷积（先水平后垂直），将复杂度从 O(n²) 降至 O(2n)。
🔧 相关工具