HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/0sMEvl4hGfE9/amnt.svg" alt="Music Note" 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="amber" data-name="Amber"><path d="M774 445c51-66 8-155-50-198-29-22-61-37-91-57-16-11-32-24-44-39-7-8-18-33-26-37s-19-1-21 8c-5 13-1 93-1 113 0 48 0 97 0 146 0 97 0 195 0 293-16-12-31-25-51-32-76-27-168 10-200 86-48 111 60 211 169 185 25-5 47-17 67-33 70-59 54-148 54-230 0-129 0-257 0-385 67 66 203 53 194 180z" fill="#fdca02" stroke="#fdca02"/></g><g id="navy" data-name="Navy"><path d="M609 321c10 4 19 10 29 13 36 14 80 26 99 62 16 30-2 68 22 78 27 13 46-20 54-41 11-25 13-51 10-78-10-83-76-132-144-170-22-13-45-27-62-46-15-16-22-43-44-52-10-4-21-4-31-1-35 10-31 50-31 79 0 19 0 37 0 57 0 93 1 186 1 279 0 29-1 58 0 87 0 10-2 20-1 31-12-2-24-8-36-11-43-9-88-2-128 19-43 22-78 61-91 109-31 114 61 218 177 211 78-5 149-59 170-135 8-29 6-60 6-90 0-134 0-267 0-401zM774 445c9-127-127-114-194-180 0 128 0 256 0 385 0 82 16 171-54 230-20 16-42 28-67 33-109 26-217-74-169-185 32-76 124-113 200-86 20 7 35 20 51 32 0-98 0-196 0-293 0-49 0-98 0-146 0-20-4-100 1-113 2-9 13-12 21-8s19 29 26 37c12 15 28 28 44 39 30 20 62 35 91 57 58 43 101 132 50 198z" fill="#021c44" stroke="#021c44"/></g></svg>
CSS background-image
.music-note {
background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/0sMEvl4hGfE9/amnt.svg");
background-size: contain;
}
CSS mask-image (takes the text colour)
.music-note {
width: 1.5em; height: 1.5em;
background-color: currentColor;
mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/0sMEvl4hGfE9/amnt.svg") center / contain no-repeat;
}
React
import MusicNoteSvg from "./music-note.jsx"; // from the React tab above
<MusicNoteSvg width={48} height={48} />