svg-explorer-extension icon indicating copy to clipboard operation
svg-explorer-extension copied to clipboard

Masks not rendered

Open lomegg opened this issue 3 years ago • 0 comments

Using example from here renders plain red square in preview, instead of masked gradient.

<svg width="200" height="200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <defs>
    <linearGradient id="Gradient">
      <stop offset="0" stop-color="white" stop-opacity="0" />
      <stop offset="1" stop-color="white" stop-opacity="1" />
    </linearGradient>
    <mask id="Mask">
      <rect x="0" y="0" width="200" height="200" fill="url(#Gradient)"  />
    </mask>
  </defs>

  <rect x="0" y="0" width="200" height="200" fill="green" />
  <rect x="0" y="0" width="200" height="200" fill="red" mask="url(#Mask)" />
</svg>

Result: image Expected result: image

lomegg avatar Nov 22 '21 13:11 lomegg