Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="900" height="256" viewBox="0,0,900,256">
      <defs>
        <linearGradient x1="0" y1="0" x2="0" y2="256" id="color-1" gradientUnits="userSpaceOnUse">
          <stop offset="0" stop-color="#000000"/>
          <stop offset="1" stop-color="#ffffff"/>
        </linearGradient>  
        <filter id="filter-sRGB" color-interpolation-filters="sRGB">
          <feOffset/>
        </filter>           
        <filter id="filter-linearRGB" color-interpolation-filters="linearRGB">
          <feOffset/>
        </filter>           
        <mask id="mask-1">
          <rect fill="url(#color-1)" x="0" y="0" width="256" height="256" />
        </mask>                                                    
      </defs>
      <g fill="none" fill-rule="nonzero" style="mix-blend-mode: normal">
        <!-- no filter -->
        <g>
          <rect x="0" y="0" width="256" height="256" fill="red"/>
          <rect x="0" y="0" width="256" height="256" fill="green" mask="url(#mask-1)"/>
        </g>
        <!-- empty filter with sRGB interpolation -->
        <g filter="url(#filter-sRGB)" transform="translate(300, 0)">
          <rect x="0" y="0" width="256" height="256" fill="red"/>
          <rect x="0" y="0" width="256" height="256" fill="green" mask="url(#mask-1)"/>
        </g>
        <!-- empty filter with linear RGB interpolation -->
        <g filter="url(#filter-linearRGB)"  transform="translate(600, 0)">
          <rect x="0" y="0" width="256" height="256" fill="red"/>
          <rect x="0" y="0" width="256" height="256" fill="green" mask="url(#mask-1)"/>
        </g>            
      </g>
</svg>
Output 300px

This bin was created anonymously and its free preview time has expired (learn why). — Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers