feConvolveMatrix 是 SVG 滤镜中最硬核、数学味最浓的一个。它允许你通过定义一个 N x N 的卷积矩阵（Kernel），对图像中的每一个像素及其周围的邻域像素进行加权求和运算。
这个听起来很复杂的数学过程，实际上是 Photoshop 中许多经典滤镜的底层原理，包括：模糊、锐化、浮雕、边缘检测等。
核心原理：
对于图像中的每个像素，滤镜会将它周围的像素值乘以矩阵中对应的数值，然后将结果相加，作为该像素的新颜色值。
关键参数：
order: 矩阵的大小，通常是 3 (3x3) 或 5 (5x5)。kernelMatrix: 以空格或逗号分隔的数值列表，定义了矩阵的具体权重。这是灵魂所在。divisor: 除数。通常设为矩阵所有数值之和，用于归一化颜色，防止画面变得太亮或太暗。bias: 偏移量。在计算结果的基础上加上一个值。常用于浮雕效果（将灰色设为基准）。浮雕效果通过让图像的一侧变亮，另一侧变暗，从而产生立体的光影感。 通常使用一个不对称的矩阵，例如左上角为负，右下角为正，中间为 0。
10<filter id="demo1-emboss">20{/*30order="3": 3x3 矩阵40kernelMatrix:50-2 -1 060-1 1 1700 1 280左上角为负（压暗），右下角为正（提亮），产生光源在右下角的错觉。90bias="0.5": 将计算结果为 0 的区域（平坦区域）提升为中性灰，而不是黑色。10*/}11<feConvolveMatrix12order="3"13kernelMatrix="-2 -1 0 -1 1 1 0 1 2"14divisor="1"15bias="0.5"16/>17</filter>
边缘检测用于提取图像的轮廓。它的原理是寻找颜色发生剧烈变化的地方。 通过让中心像素的权重与周围像素的权重符号相反，且总和为 0，平坦区域（颜色相近）的结果就会变为 0（黑色），而边缘区域（颜色差异大）则会保留下来。
10<filter id="demo2-edge">20{/*30kernelMatrix:400 1 0501 -4 1600 1 070中心是 -4，四周 4 个 1，总和为 0。80平坦区域：1+1+1+1 - 4 = 0 (黑色)90边缘区域：差异会被放大10*/}11<feConvolveMatrix12order="3"13kernelMatrix="0 1 0 1 -4 1 0 1 0"14preserveAlpha="true"15/>16</filter>1718<filter id="demo2-edge-neon">19{/* 更激进的边缘检测矩阵，配合 Matrix 变色实现霓虹风格 */}20<feConvolveMatrix21order="3"22kernelMatrix="-1 -1 -1 -1 8 -1 -1 -1 -1"23/>24<feColorMatrix type="matrix" values="0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 1 0" />25</filter>
锐化是摄影后期中不可或缺的一步。它的原理与边缘检测类似，但更为温和。 它通过增强中心像素的权重，同时减去周围像素的权重，来提高局部对比度，使细节更加清晰。注意矩阵数值的总和通常保持为 1，以维持原图的整体亮度。
10<filter id="demo3-sharpen">20{/*30kernelMatrix:400 -1 050-1 5 -1600 -1 070总和：5 + (-4) = 1 (亮度不变)80中心像素被放大 5 倍，然后减去周围的像素，90这会拉大像素间的差异，从而提升清晰度。10*/}11<feConvolveMatrix12order="3"13kernelMatrix="0 -1 0 -1 5 -1 0 -1 0"14/>15</filter>
feConvolveMatrix 就像是像素世界的魔法棒。只需要改变那几个数字，就能产生完全不同的视觉效果。