HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/5VUjnN0btY_6/amnt.svg" alt="Oval Frame" 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="teal" data-name="Teal"><path d="M498 59c-221 12-333 276-325 468 2 47 8 92 19 137 40 155 160 310 334 302 221-10 333-278 325-468-2-54-10-107-26-159-44-145-162-289-327-280zm1 94c122-9 200 109 231 212 13 42 19 86 21 130 6 135-61 357-226 368-127 8-206-113-236-222-10-39-15-79-16-119-4-135 63-357 226-369z" fill="#01999e" stroke="#01999e"/></g><g id="midnight" data-name="Midnight"><path d="M496 42c-232 12-350 286-341 487 3 69 15 139 41 203 56 140 172 258 333 251 55-2 108-23 153-55 132-94 194-275 187-432-2-54-10-108-26-160-47-156-170-302-347-294zm2 17c165-9 283 135 327 280 16 52 24 105 26 159 8 190-104 458-325 468-174 8-294-147-334-302-11-45-17-90-19-137-8-192 104-456 325-468z" fill="#021a24" stroke="#021a24"/><path d="M499 153c-163 12-230 234-226 369 1 40 6 80 16 119 30 109 109 230 236 222 165-11 232-233 226-368-2-44-8-88-21-130-31-103-109-221-231-212zm-1 17c160-14 231 198 235 324 4 129-52 335-207 351-159 16-235-197-235-322 0-38 2-75 9-112 20-98 85-231 198-241z" fill="#021a24" stroke="#021a24"/></g></svg>
CSS background-image
.oval-frame {
background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/5VUjnN0btY_6/amnt.svg");
background-size: contain;
}
CSS mask-image (takes the text colour)
.oval-frame {
width: 1.5em; height: 1.5em;
background-color: currentColor;
mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/5VUjnN0btY_6/amnt.svg") center / contain no-repeat;
}
React
import OvalFrameSvg from "./oval-frame.jsx"; // from the React tab above
<OvalFrameSvg width={48} height={48} />
