feComposite-operator-lighter.svg

Enable keyboard shortcuts

Checkerboard

<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">

    <filter id="f" x="0" y="0" width="1" height="1" color-interpolation-filters="sRGB">

        <feFlood flood-color="red"/>

        <feComposite operator="lighter" in2="SourceGraphic"/>

    </filter>

    <linearGradient id="g2b" x1="0" x2="0" y1="0" y2="1">

        <stop offset="0" stop-color="#0f0"/>

        <stop offset="1" stop-color="#00f"/>

    </linearGradient>

    <rect width="200" height="200" fill="url(#g2b)" filter="url(#f)"/>

</svg>