feComponentTransfer-discrete.svg

Enable keyboard shortcuts

Checkerboard

<!--

     Any copyright is dedicated to the Public Domain.

     http://creativecommons.org/publicdomain/zero/1.0/

-->

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

  <title>Testcase for feComponentTransfer with two discrete values applied to a gradient</title>

  <!-- From https://bugzilla.mozilla.org/show_bug.cgi?id=1915924 -->

  <defs>

    <linearGradient id="Gradient1">

      <stop offset="0%" stop-color="red" stop-opacity="100%"/>

      <stop offset="100%" stop-color="red" stop-opacity="0%"/>

    </linearGradient>

    <filter id="f1" filterUnits="objectBoundingBox" primitiveUnits="objectBoundingBox"

           x="0" y="0" width="100%" height="100%">

      <feComponentTransfer x="0" y="0" width="100%" height="100%"

        in="SourceGraphic" style="color-interpolation-filters:sRGB">

        <feFuncA type="discrete" tableValues="0 1" />

      </feComponentTransfer>

    </filter>

  </defs>

  <rect x="0" y="0" width="100%" height="50%" fill="url(#Gradient1)" filter="url(#f1)"/>

  <rect x="0" y="50%" width="100%" height="50%" fill="url(#Gradient1)"/>

</svg>