I'm trying to create a logo as an SVG. I exported the file from Illustrator. The logo has a drop shadow on it. I was looking through the XML and I found the filter node
<filter filterUnits="objectBoundingBox" width="200%" height="160%" x="-15%" y="-15%" id="AI_Shadow_2">
<feGaussianBlur stdDeviation="2" result="blur" in="SourceAlpha"></feGaussianBlur>
<feOffset result="offsetBlurredAlpha" in="blur" dy="0" dx="0"></feOffset>
<feMerge>
<feMergeNode in="offsetBlurredAlpha"></feMergeNode>
<feMergeNode in="SourceGraphic"></feMergeNode>
</feMerge>
Is there a way to change the alpha of the offsetBlurredAlpha generated? I don't want it to start at pure black I want it to start at 50% black so that the shadow effect is light enough around the object.
One way is to add a feComponentTransfer
filter primitive, like this:
<filter id="dropshadow">
<feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
<feOffset dx="2" dy="2"/>
<feComponentTransfer>
<feFuncA type="linear" slope="0.2"/>
</feComponentTransfer>
<feMerge>
<feMergeNode/>
<feMergeNode in="SourceGraphic"/>
</feMerge>
</filter>
A live example can be seen here.