conditions-08-ref.svg 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <!--
  2. Any copyright is dedicated to the Public Domain.
  3. http://creativecommons.org/publicdomain/zero/1.0/
  4. -->
  5. <svg xmlns="http://www.w3.org/2000/svg">
  6. <defs>
  7. <clipPath id="c1">
  8. <circle cx="50" cy="50" r="50"/>
  9. </clipPath>
  10. <mask id="m1">
  11. <circle cx="50" cy="50" r="50" fill="#888"/>
  12. </mask>
  13. <filter id="f1">
  14. <feColorMatrix type="hueRotate" values="60"/>
  15. </filter>
  16. <linearGradient id="l1">
  17. <stop stop-color="red"/>
  18. <stop offset="1" stop-color="yellow"/>
  19. </linearGradient>
  20. <pattern id="p1" viewBox="0 0 10 10" width="25%" height="25%">
  21. <circle cx="5" cy="5" r="5" fill="red"/>
  22. </pattern>
  23. </defs>
  24. <g fill="blue">
  25. <g transform="translate(200,50)">
  26. <rect width="100" height="100" clip-path="url(#c1)"/>
  27. </g>
  28. <g transform="translate(200,160)">
  29. <rect width="100" height="100" mask="url(#m1)"/>
  30. </g>
  31. <g transform="translate(200,270)">
  32. <rect width="100" height="100" filter="url(#f1)"/>
  33. </g>
  34. <g transform="translate(200,380)">
  35. <rect width="100" height="100" fill="url(#l1)"/>
  36. </g>
  37. <g transform="translate(200,490)">
  38. <rect width="100" height="100" fill="url(#p1)"/>
  39. </g>
  40. </g>
  41. </svg>