JSFiddle - React, Tailwind, and code Playground

by prozoroff

HTML

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" height="200" width="300">
    <defs>
    
    <pattern id="dotted_regular" width="10" height="10"
        patternUnits="userSpaceOnUse">
      <circle cx="5" cy="5" r="1"/>
     </pattern>
     
     <pattern id="dotted_rotated" width="10" height="10"
        patternUnits="userSpaceOnUse"
        patternTransform="rotate(45)">
      <circle cx="5" cy="5" r="1"/>
     </pattern>
    
  </defs>
	<rect width="100" height="100" x="50" fill="url(#dotted_regular)" />
	<rect width="100" height="100" x="200" fill="url(#dotted_rotated)" />
</svg>