pattern-transformed-01.svg

Enable keyboard shortcuts

Checkerboard

<!--

     Any copyright is dedicated to the Public Domain.

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

-->

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

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

  <pattern x="0" y="0" width="1" height="1" id="pattern">

    <rect width="240" height="240" fill="red"/>

    <rect width="240" height="240" fill="url(#gradient)"/>

  </pattern>

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

    <stop offset="0%" stop-color="black" stop-opacity="1"/>

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

  </linearGradient>

  <circle r="120" cx="120" cy="0" fill="url(#pattern)"

      transform="translate(0,120)"/>

  <path

      transform="translate(0,120)"

      d="M 480 0 A 120 120 0 0 0 240 0 A 120 120 0 0 0 480 0"

      fill="url(#pattern)"/>

</svg>