Star Score Badge SVG element, flat

<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/bFuT2ldEWhx3/amnt.svg" alt="Star Score Badge" width="48" height="48">

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024"><g id="cream" data-name="Cream"><path d="M478 178c-144 7-307 67-386 194-28 46-42 97-36 150 5 47 29 89 59 125 103 119 278 160 430 154 65-3 130-16 191-39 125-47 255-155 230-303-10-56-41-108-81-146-110-102-260-141-407-135zM648 533c12 36 21 74 32 110 4 12 28 83 27 90-2 9-9 9-16 7s-170-100-178-107c-18 7-34 20-51 30-37 22-74 44-111 66-6 4-15 12-21 13s-12-2-13-9c-1-8 13-47 16-57 10-34 20-67 30-100 3-9 13-34 12-41s-33-32-39-37c-23-21-46-42-68-62-44-40-52-42 16-48 40-3 80-6 120-9 6 0 17 0 22-3 4-3 29-62 33-72 13-30 27-59 40-89 4-8 8-17 18-12 6 3 27 55 31 64 13 30 27 60 41 90 2 5 5 16 9 19 6 4 80 7 92 8 14 1 86 4 94 9 8 4 5 12 0 17-13 16-31 28-46 42-22 20-45 40-67 61-8 7-15 15-23 20z" fill="#fcf5d6" stroke="#fcf5d6"/></g><g id="amber" data-name="Amber"><path d="M512 235c-9 16-15 34-23 51-14 31-28 62-42 93-2 5-4 13-8 15-8 5-62 7-75 8-32 2-64 6-96 7 11 13 26 23 38 35 24 22 48 44 72 65 5 5 13 9 16 15 6 10-18 78-22 93-8 25-25 71-28 94 12-10 163-100 168-100 11 0 142 87 167 99-2-31-58-169-50-185 4-8 110-100 126-116-32-1-65-5-97-7-13-1-65-2-73-8-4-2-6-10-8-15-23-48-43-96-65-144z" fill="#fdcc02" stroke="#fdcc02"/></g><g id="grape" data-name="Grape"><path d="M488 143c-153 7-320 62-413 192-37 53-58 114-55 179 3 53 27 103 59 144 104 131 295 184 457 177 61-3 121-11 180-30 147-44 307-168 286-338-28-230-314-332-514-324zm-10 35c147-6 297 33 407 135 40 38 71 90 81 146 25 148-105 256-230 303-61 23-126 36-191 39-152 6-327-35-430-154-30-36-54-78-59-125-6-53 8-104 36-150 79-127 242-187 386-194z" fill="#022362" stroke="#022362"/><path d="M648 533c8-5 15-13 23-20 22-21 45-41 67-61 15-14 33-26 46-42 5-5 8-13 0-17-8-5-80-8-94-9-12-1-86-4-92-8-4-3-7-14-9-19-14-30-28-60-41-90-4-9-25-61-31-64-10-5-14 4-18 12-13 30-27 59-40 89-4 10-29 69-33 72-5 3-16 3-22 3-40 3-80 6-120 9-68 6-60 8-16 48 22 20 45 41 68 62 6 5 38 30 39 37s-9 32-12 41c-10 33-20 66-30 100-3 10-17 49-16 57 1 7 7 10 13 9s15-9 21-13c37-22 74-44 111-66 17-10 33-23 51-30 8 7 171 105 178 107s14 2 16-7c1-7-23-78-27-90-11-36-20-74-32-110zM512 235c22 48 42 96 65 144 2 5 4 13 8 15 8 6 60 7 73 8 32 2 65 6 97 7-16 16-122 108-126 116-8 16 48 154 50 185-25-12-156-99-167-99-5 0-156 90-168 100 3-23 20-69 28-94 4-15 28-83 22-93-3-6-11-10-16-15-24-21-48-43-72-65-12-12-27-22-38-35 32-1 64-5 96-7 13-1 67-3 75-8 4-2 6-10 8-15 14-31 28-62 42-93 8-17 14-35 23-51z" fill="#022362" stroke="#022362"/></g></svg>

.star-score-badge {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/bFuT2ldEWhx3/amnt.svg");
  background-size: contain;
}

.star-score-badge {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/bFuT2ldEWhx3/amnt.svg") center / contain no-repeat;
}

import StarScoreBadgeSvg from "./star-score-badge.jsx"; // from the React tab above

<StarScoreBadgeSvg width={48} height={48} />