HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/VezDReuYD-iu/amnt.svg" alt="Rolling Hills" 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="green" data-name="Green"><path d="M333 354c-83 2-138 80-184 139-15 19-30 38-49 55-9 9-20 17-29 28-7 8-36 51-23 59 4 3 62 1 72 1 214 0 429 0 644 0 53 0 107 0 161 0 8 0 50 2 53-3s-1-15-3-20c-6-18-18-34-32-47-13-13-27-25-39-38-46-49-90-92-163-70-87 27-120 119-216 26-56-53-106-131-192-130z" fill="#4bad1b" stroke="#4bad1b"/></g><g id="forest" data-name="Forest"><path d="M330 341c-87 4-144 81-192 144-20 27-43 49-67 72-16 15-61 74-29 90 14 8 38 3 54 3 223 0 446 0 670 0 56 0 112 0 168 0 14 0 34 4 47-2 29-13-4-64-16-79-16-18-35-32-51-50-42-45-85-89-153-79-92 13-138 125-228 33-57-57-113-136-203-132zm3 13c86-1 136 77 192 130 96 93 129 1 216-26 73-22 117 21 163 70 12 13 26 25 39 38 14 13 26 29 32 47 2 5 6 15 3 20s-45 3-53 3c-54 0-108 0-161 0-215 0-430 0-644 0-10 0-68 2-72-1-13-8 16-51 23-59 9-11 20-19 29-28 19-17 34-36 49-55 46-59 101-137 184-139z" fill="#045413" stroke="#045413"/></g></svg>
CSS background-image
.rolling-hills {
background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/VezDReuYD-iu/amnt.svg");
background-size: contain;
}
CSS mask-image (takes the text colour)
.rolling-hills {
width: 1.5em; height: 1.5em;
background-color: currentColor;
mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/VezDReuYD-iu/amnt.svg") center / contain no-repeat;
}
React
import RollingHillsSvg from "./rolling-hills.jsx"; // from the React tab above
<RollingHillsSvg width={48} height={48} />
