Smiley Face SVG illustration, flat

<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/WMETco-ERiAb/amnt.svg" alt="Smiley Face" width="48" height="48">

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024"><g id="yellow" data-name="Yellow"><path d="M491 90c-226 10-399 204-389 428 10 226 209 395 431 386 224-9 398-206 388-428-10-225-208-396-430-386zM352 386c61-4 67 88 8 93-61 5-68-88-8-93zm311 0c61-4 68 88 8 93-60 4-68-88-8-93zM224 486c90-9 105 127 17 137-91 9-105-127-17-137zm559 0c90-9 103 129 15 137-90 9-104-127-15-137zM343 560c4 0 9 1 13 4 8 5 15 26 22 35 11 15 25 27 40 37 36 24 81 31 123 25 37-6 74-25 98-55 8-9 23-42 31-44 12-5 25 3 25 16 0 8-6 16-9 22-39 72-126 107-204 96-39-6-76-22-105-47-12-11-78-83-34-89z" fill="#fdde05" stroke="#fdde05"/></g><g id="black" data-name="Black"><path d="M494 61c-243 11-429 211-421 455 8 241 218 426 457 417 240-9 430-213 420-454-10-240-216-428-456-418zm-3 29c222-10 420 161 430 386 10 222-164 419-388 428-222 9-421-160-431-386-10-224 163-418 389-428z" fill="#220e09" stroke="#220e09"/><path d="M343 560c-44 6 22 78 34 89 29 25 66 41 105 47 78 11 165-24 204-96 3-6 9-14 9-22 0-13-13-21-25-16-8 2-23 35-31 44-24 30-61 49-98 55-42 6-87-1-123-25-15-10-29-22-40-37-7-9-14-30-22-35-4-3-9-4-13-4z" fill="#220e09" stroke="#220e09"/><path d="M352 386c-60 5-53 98 8 93 59-5 53-97-8-93z" fill="#220e09" stroke="#220e09"/><path d="M663 386c-60 5-52 97 8 93 60-5 53-97-8-93z" fill="#220e09" stroke="#220e09"/></g><g id="coral" data-name="Coral"><path d="M224 486c-88 10-74 146 17 137 88-10 73-146-17-137z" fill="#fb615e" stroke="#fb615e"/><path d="M783 486c-89 10-75 146 15 137 88-8 75-146-15-137z" fill="#fb615e" stroke="#fb615e"/></g></svg>

.smiley-face {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/WMETco-ERiAb/amnt.svg");
  background-size: contain;
}

import SmileyFaceSvg from "./smiley-face.jsx"; // from the React tab above

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