HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/VL39PEcHkuEK/amnt.svg" alt="Hail" 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="sky" data-name="Sky"><path d="M503 118c-70 5-133 52-159 116-5 13-6 28-12 40-1 4-3 7-8 8-4 1-10-1-13-1-17-1-33 1-49 7-31 11-58 33-73 63-35 67-1 149 68 176 11 4 22 7 34 8 25 2 50 0 76 0 52 0 104 0 157 0 47 0 94 0 142 0 22 0 45 2 67 0 17-2 35-7 50-15 65-36 88-123 44-185-20-28-53-46-87-49-12-2-32 3-39 2-4-1-7-3-9-6-4-7-3-18-4-26-3-13-7-25-13-37-30-65-100-106-172-101z" fill="#84c5fb" stroke="#84c5fb"/></g><g id="navy" data-name="Navy"><path d="M715 261c-7-15-8-32-15-48-32-72-107-120-185-120-100 0-177 69-204 162-11 4-25 2-36 4-41 8-79 33-101 68-31 47-32 112-2 160 49 79 122 73 204 73 45 0 90 0 135 0 44 0 90 0 135 0 80 0 157 7 205-71 47-75 20-180-63-216-24-11-48-12-73-12zM503 118c72-5 142 36 172 101 6 12 10 24 13 37 1 8 0 19 4 26 2 3 5 5 9 6 7 1 27-4 39-2 34 3 67 21 87 49 44 62 21 149-44 185-15 8-33 13-50 15-22 2-45 0-67 0-48 0-95 0-142 0-53 0-105 0-157 0-26 0-51 2-76 0-12-1-23-4-34-8-69-27-103-109-68-176 15-30 42-52 73-63 16-6 32-8 49-7 3 0 9 2 13 1 5-1 7-4 8-8 6-12 7-27 12-40 26-64 89-111 159-116z" fill="#042142" stroke="#042142"/><path d="M370 588c-108 7-100 172 10 166 108-6 100-173-10-166zm-3 22c82-9 94 114 16 122-81 9-94-113-16-122z" fill="#042142" stroke="#042142"/><path d="M504 750c-108 10-93 176 16 165 108-11 93-175-16-165zm5 21c80-4 86 119 6 123s-86-119-6-123z" fill="#042142" stroke="#042142"/><path d="M646 588c-109 4-103 170 7 166 108-4 102-170-7-166zm-6 22c81-10 97 111 17 122s-95-112-17-122z" fill="#042142" stroke="#042142"/></g><g id="mist" data-name="Mist"><path d="M640 610c-78 10-63 133 17 122s64-132-17-122z" fill="#dbeefc" stroke="#dbeefc"/><path d="M509 771c-80 4-74 127 6 123s74-127-6-123z" fill="#dbeefc" stroke="#dbeefc"/><path d="M367 610c-78 9-65 131 16 122 78-8 66-131-16-122z" fill="#dbeefc" stroke="#dbeefc"/></g></svg>
CSS background-image
.hail {
background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/VL39PEcHkuEK/amnt.svg");
background-size: contain;
}
CSS mask-image (takes the text colour)
.hail {
width: 1.5em; height: 1.5em;
background-color: currentColor;
mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/VL39PEcHkuEK/amnt.svg") center / contain no-repeat;
}
React
import HailSvg from "./hail.jsx"; // from the React tab above
<HailSvg width={48} height={48} />