HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/tEFqPLVNduQ8/amnt.svg" alt="Blob 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="red" data-name="Red"><path d="M654 96c-56 5-106 65-153 93-66 39-125 36-192 6-60-27-127-56-183-2-68 65 21 124-6 188-23 55-111 74-84 154 23 68 105 61 73 157-5 13-10 28-11 43-3 52 40 96 91 101 70 6 125-45 192-54 36-5 75 1 108 19 57 31 92 92 166 83 27-3 52-18 72-38 12-13 22-28 34-43 31-41 65-49 113-55 70-9 122-53 118-128-4-71-86-93-89-158-3-68 80-107 54-182-12-35-47-55-84-55-30 0-62 7-87-15-19-16-25-40-37-61-19-34-55-56-95-53zM282 263c32-2 65 0 98 0 64 0 129 0 194 0 34 0 68 0 102 0 55 0 111-5 153 38 15 14 25 33 30 53 11 45 5 153 5 205 0 22 1 45-2 66-10 66-58 99-120 104-34 3-69 1-103 1-63 0-126 0-188 0-34 0-67 0-100 0-55 0-114 5-156-37-14-14-23-31-29-50-12-42-6-158-6-208 0-26-1-52 4-77 13-57 61-91 118-95z" fill="#fb523e" stroke="#fb523e"/></g><g id="navy" data-name="Navy"><path d="M651 80c-64 6-107 65-159 95-73 43-123 29-195-4-63-29-136-42-188 16-69 75 25 139-8 195-10 17-25 27-39 40-35 31-59 76-40 123 19 48 84 65 78 119-2 15-10 30-13 44-20 73 28 135 101 144 72 9 129-45 198-54 125-16 157 113 266 103 35-3 64-21 89-46 14-14 24-31 36-46 35-43 74-38 123-49 66-14 115-74 108-143-9-82-93-102-88-165 3-44 52-77 57-132 2-19 0-38-8-55-6-12-15-23-25-32-53-44-120-3-152-40-14-15-19-35-29-53-22-40-66-64-112-60zm3 16c40-3 76 19 95 53 12 21 18 45 37 61 25 22 57 15 87 15 37 0 72 20 84 55 26 75-57 114-54 182 3 65 85 87 89 158 4 75-48 119-118 128-48 6-82 14-113 55-12 15-22 30-34 43-20 20-45 35-72 38-74 9-109-52-166-83-33-18-72-24-108-19-67 9-122 60-192 54-51-5-94-49-91-101 1-15 6-30 11-43 32-96-50-89-73-157-27-80 61-99 84-154 27-64-62-123 6-188 56-54 123-25 183 2 67 30 126 33 192-6 47-28 97-88 153-93z" fill="#021443" stroke="#021443"/><path d="M282 263c-57 4-105 38-118 95-5 25-4 51-4 77 0 50-6 166 6 208 6 19 15 36 29 50 42 42 101 37 156 37 33 0 66 0 100 0 62 0 125 0 188 0 34 0 69 2 103-1 62-5 110-38 120-104 3-21 2-44 2-66 0-52 6-160-5-205-5-20-15-39-30-53-42-43-98-38-153-38-34 0-68 0-102 0-65 0-130 0-194 0-33 0-66-2-98 0zm10 15c92-4 185 0 277 0 37 0 74 0 112 0 28 0 58-3 86 4 18 5 35 14 48 27 13 12 23 28 28 46 11 39 5 151 5 198 0 23 2 48-2 71-10 61-57 88-114 90-30 1-60 0-90 0-63 0-124 0-186 0-38 0-77 0-114 0-27 0-55 2-81-3-20-4-38-13-52-27-13-12-23-29-28-46-11-37-5-153-5-198 0-24-2-48 2-71 10-61 56-88 114-91z" fill="#021443" stroke="#021443"/></g></svg>
CSS background-image
.blob-frame {
background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/tEFqPLVNduQ8/amnt.svg");
background-size: contain;
}
CSS mask-image (takes the text colour)
.blob-frame {
width: 1.5em; height: 1.5em;
background-color: currentColor;
mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/tEFqPLVNduQ8/amnt.svg") center / contain no-repeat;
}
React
import BlobFrameSvg from "./blob-frame.jsx"; // from the React tab above
<BlobFrameSvg width={48} height={48} />