Does it need to be a gradient or a filter? I would suggest using a <mask>
that contains a rect with a gradient applied, but I'm not sure about the requirements you have.
<svg>
<defs>
<linearGradient id="fadeGrad" y2="1" x2="0">
<stop offset="0.5" stop-color="white" stop-opacity="0"/>
<stop offset="1" stop-color="white" stop-opacity=".5"/>
</linearGradient>
<mask id="fade" maskContentUnits="objectBoundingBox">
<rect width="1" height="1" fill="url(#fadeGrad)"/>
</mask>
</defs>
<path
d="M 10,30 A 20,20 0,0,1 50,30 A 20,20 0,0,1 90,30 Q 90,60 50,90 Q 10,60 10,30 z"
fill="green"
stroke="red"
mask="url(#fade)"
/>
</svg>
See a similar example here.