HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/a9NjN4QY76C6/amnt.svg" alt="Rotating Arrows" width="48" height="48">
Inline SVG
<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="M886 434c-4 26-18 57-48 55-18-2-37-13-55-19 6 24 5 49 2 73-12 111-97 208-205 235-71 18-148 5-209-34-26-17-49-38-67-63-4-6-16-18-15-26 1-11 50-22 61-26l1-2c-12-12-138-117-146-120l-89 196c17 7 54-29 67-9 4 6 6 13 9 19 7 13 16 27 26 39 27 35 61 65 98 88 89 56 201 70 301 42 87-25 166-80 217-155 48-69 70-151 63-234-1-18-3-42-11-59z" fill="#fc881a" stroke="#fc881a"/></g><g id="turquoise" data-name="Turquoise"><path d="M868 218c-75 39-36 47-94-12-29-29-62-53-98-71-87-43-186-47-278-16-131 43-234 156-262 292-7 38-5 72-6 110 34-42 42-90 109-61 0-19 7-39 13-58 30-91 108-162 201-186 63-17 130-8 187 25 23 13 45 31 63 52 3 4 10 11 10 16-1 7-45 32-53 36 33 18 69 34 103 50 21 10 53 30 74 35 8-36 12-72 18-108 2-10 17-98 17-99-1-2-2-4-4-5z" fill="#23c3aa" stroke="#23c3aa"/></g><g id="navy" data-name="Navy"><path d="M169 709c25 50 63 93 108 127 246 185 616 21 639-283 4-49-2-98-19-144-3-8-6-23-16-24-24-1 0 85-40 85-22 0-42-19-63-21-21-1-13 20-11 33 1 9 2 18 2 28 1 44-13 90-35 129-68 122-226 164-346 94-31-18-55-43-76-71 14-8 32-8 46-17 10-6 13-18 7-29-4-8-44-38-54-46-15-12-87-76-98-79-6-2-14-2-19 2-10 6-58 119-66 138-7 16-30 57-28 72 4 37 50 7 69 6zM886 434c8 17 10 41 11 59 7 83-15 165-63 234-51 75-130 130-217 155-100 28-212 14-301-42-37-23-71-53-98-88-10-12-19-26-26-39-3-6-5-13-9-19-13-20-50 16-67 9l89-196c8 3 134 108 146 120l-1 2c-11 4-60 15-61 26-1 8 11 20 15 26 18 25 41 46 67 63 61 39 138 52 209 34 108-27 193-124 205-235 3-24 4-49-2-73 18 6 37 17 55 19 30 2 44-29 48-55z" fill="#02193c" stroke="#02193c"/><path d="M816 227c-208-270-626-142-697 176-9 43-12 90-5 134 2 9 6 17 17 13 8-3 40-55 48-65 32-41 62 14 75-7 5-8 4-22 5-31 7-38 22-73 43-104 71-104 210-151 325-88 23 12 47 29 62 51-12 8-26 14-37 24-32 28 40 51 58 60 27 14 55 27 83 40 11 5 23 14 35 17 6 1 11 1 16-1 6-3 10-9 11-14 7-20 8-44 11-64 4-28 10-54 14-82 3-21 26-97-20-84-16 4-29 18-44 25zm52-9c2 1 3 3 4 5 0 1-15 89-17 99-6 36-10 72-18 108-21-5-53-25-74-35-34-16-70-32-103-50 8-4 52-29 53-36 0-5-7-12-10-16-18-21-40-39-63-52-57-33-124-42-187-25-93 24-171 95-201 186-6 19-13 39-13 58-67-29-75 19-109 61 1-38-1-72 6-110 28-136 131-249 262-292 92-31 191-27 278 16 36 18 69 42 98 71 58 59 19 51 94 12z" fill="#02193c" stroke="#02193c"/></g></svg>
CSS background-image
.rotating-arrows {
background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/a9NjN4QY76C6/amnt.svg");
background-size: contain;
}
CSS mask-image (takes the text colour)
.rotating-arrows {
width: 1.5em; height: 1.5em;
background-color: currentColor;
mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/a9NjN4QY76C6/amnt.svg") center / contain no-repeat;
}
React
import RotatingArrowsSvg from "./rotating-arrows.jsx"; // from the React tab above
<RotatingArrowsSvg width={48} height={48} />