Vachmi

The <feDiffuseLighting> filter lights an image using the alpha channel of the image as a bump map. Bump maps simulate bumps and wrinkles on the surface of an object without changing the underlying object. With diffuse lighting the sides of the object facing the light are brighter and the sides facing away are darker and in shadow.

Diffuse lighting is light striking a rough surface where the angle of reflected light will vary depending on where the light strikes the surface. SVG allows us to work with diffuse lighting through the feDiffuseLighting filter primitive.

Attributes

Attribute
Description
in
Identifies the input for the filter primitive
surfaceScale
This attribute represent the height of the surface for a light filter primitive. If the attribute is not specified, then the effect is as if a value of 1 were specified.
diffuseConstant
The attribute represant the kd value in the Phong lighting model.
In SVG, this can be any non-negative number. If the attribute is not specified, then the effect is as if a value of 1 were specified.
kernelUnitLength
This attribute has 2 values - dx and dy. It Indicates the intended distance in current filter units (i.e., units as determined by the value of attribute primitiveUnits) for dx and dy, respectively, in the surface normal calculation formulas.

Here is the SVG code to draw this filter.

Original Image with no filter
<svg id='circle1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'>
  <circle cx="25" cy="25" r="25" fill="violet">
</svg>
Image with feDiffuseLight with fePointLight filter
<svg id='circle1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'>
 <filter id="diffuseLight-Ex1">
  <feDiffuseLighting in="SourceGraphic" result="light" lighting-color="white">
   <fePointLight x="20" y="20" z="20" />
  </feDiffuseLighting>
  <feComposite in="SourceGraphic" in2="light" operator="arithmetic" k1="1" k2="0" k3="0" k4="0"/>
 </filter>
 <circle cx="25" cy="25" r="25" fill="violet" filter="url(#diffuseLight-Ex1)" />
</svg>

Image with feDiffuseLight with feDistantLight filter
<svg id='circle1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'>
 <filter id="diffuseLight-Ex2">
  <feDiffuseLighting in="SourceGraphic" result="light" lighting-color="white">
   <feDistantLight azimuth="200" elevation="20" />
  </feDiffuseLighting>
  <feComposite in="SourceGraphic" in2="light" operator="arithmetic" k1="1" k2="0" k3="0" k4="0"/>
 </filter>
 <circle cx="25" cy="25" r="25" fill="violet" filter="url(#diffuseLight-Ex2)"/>
</svg>

Image with feDiffuseLight with feSpotLight filter
<svg id='circle1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'>
 <filter id="diffuseLight-Ex3">
  <feDiffuseLighting in="SourceGraphic" result="light" lighting-color="white">
   <feSpotLight x="60" y="5" z="30" limitingConeAngle="20" pointsAtX="30" pointsAtY="30" pointsAtZ="0" />
  </feDiffuseLighting>
  <feComposite in="SourceGraphic" in2="light" operator="arithmetic" k1="1" k2="0" k3="0" k4="0"/>
 </filter>
 <circle cx="25" cy="25" r="25" fill="violet" filter="url(#diffuseLight-Ex3)"/>
</svg>