Crosshair Grid SVG element, flat

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

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024"><g id="navy" data-name="Navy"><path d="M522 131c0-10 5-44-10-43-14 1-9 33-9 43h-99c0-7 4-32-5-33v33h-104c0-4 1-32-3-32-5 0-3 27-3 32h-105c0-5 2-34-3-32-3 1-2 28-2 32-7 0-41-3-42 5 13 4 29 1 42 1v106c-7 0-42-3-42 5 11 5 30 1 42 1v106c-8 2-42-1-42 3s34 3 42 3v101c-10 0-53-5-52 9s42 9 52 9v101c-6 0-46-2-41 4 2 3 35 1 41 1v107c-6 0-45-3-41 4 2 4 35 1 41 2v107c-9 0-44-2-42 3 2 3 36 2 42 2l1 40c7 0 4-33 4-40h105c0 7-3 40 5 40 2-13 1-27 0-40h105c0 7-3 40 5 40v-40h99c0 10-5 48 10 47 13-1 9-37 9-47h98l1 40h4v-40h105c0 7-3 40 5 40v-40h105c0 6-2 41 3 40s3-34 3-40h41v-4l-41-1c-1-35 0-71 0-107 6 0 42 2 41-3s-35-3-41-3v-107h41c0-8-33-5-40-5-5-24-1-74-1-101 11 0 53 6 51-10-1-13-40-6-51-9v-100c6 0 44 3 41-4-2-4-34-1-41-2v-106c6 0 42 2 41-3s-35-3-41-3v-106c6 0 42 2 41-3s-35-3-41-3v-31l-6-1v32h-105c0-7 4-32-5-33v33h-105c0-7 4-32-5-33v33zm-233 6v106h-105v-106zm110 0v106h-103c-3-10-1-20-1-30 0-26-1-51-1-76zm104 0v106h-97c-3-11-4-97 0-106zm117 0v106h-98v-106zm110 0v106h-104l-1-106zm110 0v106h-105v-106zM184 249h105v106h-105zm110 0h105v106h-105zm112 0h97v106h-97c-4-8-4-98 0-106zm116 0h98v106c-16 0-89 3-98 0zm103 0h105v107l-103-1c-6-15-2-86-2-106zm110 0h105v106h-105zM184 361h105v101h-105zm111 0h104v101l-104-1c-2-9-2-95 0-100zm330 0h105v101h-105zm110 0h105v101c-23 0-87 3-105-1zM184 480h105v101h-105zm215 0v101h-105c0-18-3-89 2-101zm226 0h105v101h-103c-5-12-2-83-2-101zm215 0v101h-105v-101zM289 587v106h-105c0-12-1-104 1-106 3-3 92 1 104 0zm110-1v107h-103c-5-12 0-51-1-66 0-4-1-37-1-38 1-2 1-2 3-3 1-1 92 0 102 0zm104 1v106h-99c0-18-3-96 2-107zm117-1v107h-98v-106zm110 0v107h-103c-6-15-2-87-2-107zm110 2v105h-105v-107c17 0 95-2 105 2zM289 699v107h-105v-107zm110 0v107h-104l-1-106c4-2 97-3 105-1zm104 0v107h-99c0-13-2-100 0-104 1-3 1-3 3-4 1-1 40 1 49 1 15 0 32-3 47 0zm19 0l98-1v108h-98zm208-2v109h-105v-108c35 0 71 4 105-1zm110 2v107h-105v-107zM503 448c6-1 14-2 19 1v-88h98v101l-85-1v19h85v101h-98v-88c-6 3-13 2-19 1v87h-97c-6-32-2-68-2-101h86v-19h-86v-100h99z" fill="#01214d" stroke="#01214d"/></g><g id="orange" data-name="Orange"><path d="M522 449c-5-3-13-2-19-1-5 3-10 8-13 13v19c3 6 8 9 13 14 6 1 13 2 19-1 6-2 9-8 13-13v-19c-4-5-7-10-13-12z" fill="#fd6e01" stroke="#fd6e01"/></g></svg>

.crosshair-grid {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/sb_o_XyQ2Z5_/amnt.svg");
  background-size: contain;
}

.crosshair-grid {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/sb_o_XyQ2Z5_/amnt.svg") center / contain no-repeat;
}

import CrosshairGridSvg from "./crosshair-grid.jsx"; // from the React tab above

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