Triangle Bullet SVG element, flat

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

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024"><g id="red" data-name="Red"><path d="M282 178c-6 1-11 6-13 12-3 14 0 102 0 124 0 49 0 98 0 148 0 84-1 170-1 255 0 12 2 25 1 38 0 10-3 34 1 43 2 5 6 7 11 7 8-1 44-24 53-29 32-18 64-36 95-54 63-35 126-71 189-106 63-36 126-72 189-108 5-2 16-6 16-13-1-8-62-40-72-46-31-19-62-37-93-55-62-37-124-74-186-111-31-18-63-36-94-54-15-9-84-53-96-51z" fill="#fd0202" stroke="#fd0202"/></g><g id="black" data-name="Black"><path d="M280 162c-10 2-20 9-24 18-9 17-4 87-4 111 0 52 0 104 0 156 0 103 0 207 0 311 0 12-1 24 0 36 6 47 50 19 72 6 33-18 66-37 99-55 66-38 133-75 199-113 66-37 133-74 199-113 53-31-22-61-46-75-33-19-66-38-98-57-65-39-129-79-195-116-33-19-66-39-99-58-20-12-83-54-103-51zm2 16c12-2 81 42 96 51 31 18 63 36 94 54 62 37 124 74 186 111 31 18 62 36 93 55 10 6 71 38 72 46 0 7-11 11-16 13-63 36-126 72-189 108-63 35-126 71-189 106-31 18-63 36-95 54-9 5-45 28-53 29-5 0-9-2-11-7-4-9-1-33-1-43 1-13-1-26-1-38 0-85 1-171 1-255 0-50 0-99 0-148 0-22-3-110 0-124 2-6 7-11 13-12z" fill="#030202" stroke="#030202"/></g></svg>

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

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

import TriangleBulletSvg from "./triangle-bullet.jsx"; // from the React tab above

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