SVG Filters Blur Filters: feGaussianBlur with hard edges & 100% Opacity

Help us to keep this website almost Ad Free! It takes only 10 seconds of your time:
> Step 1: Go view our video on YouTube: EF Core Bulk Insert
> Step 2: And Like the video. BONUS: You can also share it!

Example

<svg width="900px" height="400px" viewBox="900 400">
   <defs>
      <filter id="GaussianHardEdge" x="0%" y="0%" width="100%" height="100%">
         <feGaussianBlur stdDeviation="5"/>
         <feComponentTransfer>
           <feFuncA type="table" tableValues="1 1"/>
         </feComponentTransfer>
      </filter>
   </defs>
        
   <image xlink:href="https://upload.wikimedia.org/wikipedia/commons/a/af/Fruit_Stall_in_Barcelona_Market.jpg" x="20px" y="20px" width="300px" height="200px" preserveAspectRatio="xMinYMin meet" />
   <image filter="url(#GaussianHardEdge)" xlink:href="https://upload.wikimedia.org/wikipedia/commons/a/af/Fruit_Stall_in_Barcelona_Market.jpg" x="340px" y="20px" width="300px" height="200px" preserveAspectRatio="xMinYMin meet"/>
</svg>

enter image description here
(Source image by Daderot at Wikimedia Commons)



Got any SVG Question?