Crossing Arrows SVG element, flat

<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/40NREzVIyCpW/amnt.svg" alt="Crossing Arrows" width="48" height="48">

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024"><g id="orange" data-name="Orange"><path d="M949 54c-14 1-84 21-103 26-10 2-90 20-92 23-3 3-2 5 0 8 5 11 54 32 53 44-1 5-11 12-14 16-22 21-43 42-64 63-86 84-172 168-257 253-85 84-173 166-257 251-22 21-43 43-65 63-4 4-9 11-14 11-15 0-44-53-56-40-4 5-18 94-21 107-2 11-4 23-6 35-4 22-16 56 20 53s72-15 107-22c10-2 73-12 75-19s-10-13-15-17c-44-33-51-25-12-63 21-21 43-41 64-62 85-85 172-168 257-252 85-85 172-168 257-253 9-9 58-62 66-61 13 2 38 57 49 51 5-3 5-14 7-19 7-35 15-69 23-104 3-15 18-67 16-79-2-9-10-13-18-13z" fill="#fd7e01" stroke="#fd7e01"/></g><g id="grape" data-name="Grape"><path d="M239 154c14-11 33-19 44-33 32-38-48-47-68-51-26-7-126-35-145-33-8 1-14 4-19 9-6 5-10 11-11 18-3 20 23 122 29 149 4 19 5 43 13 60 6 13 23 18 35 10 9-5 30-35 37-45l272 270-290 283c-15-16-55-62-72-25-8 16-10 42-13 60-5 25-24 108-21 128 2 11 9 21 19 26 5 3 12 5 18 5 14 0 28-5 42-8 34-6 67-13 101-20 19-4 58-4 62-28 5-27-34-38-48-54l289-283 286 284c-15 12-51 31-48 53 3 26 46 26 65 30 26 5 126 28 144 26 7-1 13-3 18-7 9-6 15-16 16-28 1-18-18-104-23-128-3-17-4-37-10-53-3-6-7-12-13-14-22-11-47 23-62 38l-287-285 271-269c11 18 51 77 70 34 8-18 9-42 14-61 8-32 14-64 21-96 3-14 9-30 9-44 0-10-3-19-10-26-6-5-13-8-20-9-17-2-121 28-146 34-20 5-73 9-73 36 0 8 3 14 10 19 12 11 28 17 39 30l-270 265zM502 433l-64 63c-77-78-156-154-233-231-8-8-42-47-51-48-5 0-7 3-11 7-6 8-34 49-42 45-5-2-6-15-7-20-6-32-13-64-20-96-4-17-18-68-17-82 0-5 2-9 5-12s8-5 12-5c11-1 65 15 81 19 31 7 62 15 93 22 6 1 19 2 22 7 2 2 2 4 1 6-1 4-38 30-44 34-5 4-9 6-9 12 1 8 40 42 48 49 47 48 95 95 144 141 31 28 59 64 92 89zM949 54c8 0 16 4 18 13 2 12-13 64-16 79-8 35-16 69-23 104-2 5-2 16-7 19-11 6-36-49-49-51-8-1-57 52-66 61-85 85-172 168-257 253-85 84-172 167-257 252-21 21-43 41-64 62-39 38-32 30 12 63 5 4 17 10 15 17s-65 17-75 19c-35 7-71 19-107 22s-24-31-20-53c2-12 4-24 6-35 3-13 17-102 21-107 12-13 41 40 56 40 5 0 10-7 14-11 22-20 43-42 65-63 84-85 172-167 257-251 85-85 171-169 257-253 21-21 42-42 64-63 3-4 13-11 14-16 1-12-48-33-53-44-2-3-3-5 0-8 2-3 82-21 92-23 19-5 89-25 103-26zM586 520c78 77 157 154 235 232 10 11 48 52 59 58 21 13 52-58 64-36 4 7 16 85 19 99 3 17 15 64 13 78-1 6-6 12-11 14-13 7-80-11-97-14-13-2-93-16-97-20-15-15 56-39 48-59-3-8-49-50-58-59-79-78-158-155-236-233z" fill="#01114b" stroke="#01114b"/></g><g id="blue" data-name="Blue"><path d="M502 433c-33-25-61-61-92-89-49-46-97-93-144-141-8-7-47-41-48-49 0-6 4-8 9-12 6-4 43-30 44-34 1-2 1-4-1-6-3-5-16-6-22-7-31-7-62-15-93-22-16-4-70-20-81-19-4 0-9 2-12 5s-5 7-5 12c-1 14 13 65 17 82 7 32 14 64 20 96 1 5 2 18 7 20 8 4 36-37 42-45 4-4 6-7 11-7 9 1 43 40 51 48 77 77 156 153 233 231z" fill="#0184fc" stroke="#0184fc"/><path d="M586 520l-61 60c78 78 157 155 236 233 9 9 55 51 58 59 8 20-63 44-48 59 4 4 84 18 97 20 17 3 84 21 97 14 5-2 10-8 11-14 2-14-10-61-13-78-3-14-15-92-19-99-12-22-43 49-64 36-11-6-49-47-59-58-78-78-157-155-235-232z" fill="#0184fc" stroke="#0184fc"/></g></svg>

.crossing-arrows {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/40NREzVIyCpW/amnt.svg");
  background-size: contain;
}

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

import CrossingArrowsSvg from "./crossing-arrows.jsx"; // from the React tab above

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