Grain SVG pattern, flat

<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/cB3rzaJ-ZJNs/amnt.svg" alt="Grain" width="48" height="48">

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><rect width="200" height="200" fill="#f2eadb"/><defs><pattern id="grain" width="50" height="50" patternUnits="userSpaceOnUse"><g fill="#705544"><ellipse cx="3" cy="4" rx="1.6" ry="1.1" transform="rotate(-25 3 4)"/><circle cx="9" cy="3" r="1.2"/><ellipse cx="15" cy="5" rx="1.8" ry="1" transform="rotate(30 15 5)"/><circle cx="23" cy="3" r="1.4"/><ellipse cx="29" cy="6" rx="1.2" ry="1.8" transform="rotate(20 29 6)"/><circle cx="36" cy="3" r="1.1"/><ellipse cx="43" cy="5" rx="1.7" ry="1.1" transform="rotate(-35 43 5)"/><circle cx="48" cy="2" r="1"/><circle cx="5" cy="11" r="1.3"/><ellipse cx="12" cy="12" rx="1.1" ry="1.7" transform="rotate(-20 12 12)"/><circle cx="18" cy="10" r="1"/><ellipse cx="25" cy="13" rx="1.8" ry="1.2" transform="rotate(25 25 13)"/><circle cx="32" cy="11" r="1.5"/><ellipse cx="39" cy="12" rx="1" ry="1.6" transform="rotate(35 39 12)"/><circle cx="46" cy="11" r="1.3"/><ellipse cx="2" cy="18" rx="1.2" ry="1.7" transform="rotate(30 2 18)"/><circle cx="9" cy="19" r="1.5"/><ellipse cx="16" cy="18" rx="1.8" ry="1" transform="rotate(-15 16 18)"/><circle cx="22" cy="20" r="1.1"/><ellipse cx="29" cy="18" rx="1.2" ry="1.7" transform="rotate(-30 29 18)"/><circle cx="35" cy="19" r="1.3"/><ellipse cx="43" cy="19" rx="1.7" ry="1.1" transform="rotate(20 43 19)"/><circle cx="48" cy="17" r="1"/><circle cx="5" cy="26" r="1.1"/><ellipse cx="12" cy="25" rx="1.8" ry="1.2" transform="rotate(35 12 25)"/><circle cx="19" cy="27" r="1.4"/><ellipse cx="26" cy="25" rx="1" ry="1.6" transform="rotate(-25 26 25)"/><circle cx="32" cy="27" r="1.2"/><ellipse cx="39" cy="26" rx="1.7" ry="1.1" transform="rotate(-20 39 26)"/><circle cx="46" cy="26" r="1.4"/><ellipse cx="2" cy="34" rx="1.7" ry="1.1" transform="rotate(-30 2 34)"/><circle cx="9" cy="33" r="1.2"/><ellipse cx="16" cy="35" rx="1.1" ry="1.8" transform="rotate(20 16 35)"/><circle cx="23" cy="33" r="1.5"/><ellipse cx="30" cy="34" rx="1.8" ry="1" transform="rotate(30 30 34)"/><circle cx="37" cy="33" r="1.1"/><ellipse cx="44" cy="35" rx="1.2" ry="1.7" transform="rotate(-25 44 35)"/><circle cx="49" cy="32" r="1"/><circle cx="5" cy="42" r="1.4"/><ellipse cx="12" cy="41" rx="1.7" ry="1.1" transform="rotate(25 12 41)"/><circle cx="19" cy="43" r="1.1"/><ellipse cx="26" cy="41" rx="1.2" ry="1.8" transform="rotate(-20 26 41)"/><circle cx="33" cy="43" r="1.3"/><ellipse cx="40" cy="42" rx="1.8" ry="1.1" transform="rotate(-35 40 42)"/><circle cx="47" cy="42" r="1.2"/><ellipse cx="3" cy="48" rx="1.1" ry="1.5" transform="rotate(20 3 48)"/><circle cx="10" cy="48" r="1"/><ellipse cx="17" cy="48" rx="1.6" ry="1" transform="rotate(-20 17 48)"/><circle cx="24" cy="48" r="1.2"/><ellipse cx="31" cy="48" rx="1.1" ry="1.5" transform="rotate(30 31 48)"/><circle cx="38" cy="48" r="1"/><ellipse cx="45" cy="48" rx="1.6" ry="1" transform="rotate(20 45 48)"/></g></pattern></defs><rect width="200" height="200" fill="url(#grain)"/></svg>

.grain {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/cB3rzaJ-ZJNs/amnt.svg");
  background-size: 200px 200px;
}

import GrainSvg from "./grain.jsx"; // from the React tab above

<GrainSvg width={48} height={48} />