Сделать яйцо на Пасху на HTML

html { 
  height: 100%; 
} 
 
body { 
  display: flex; 
  justify-content: center; 
  align-items: center; 
  align-content: center; 
  height: 100%; 
} 
 
.str { 
  stroke: #7247cb; 
  stroke-width: 5px; 
} 
 
.str2 { 
  stroke: #7247cb; 
  stroke-width: 2px; 
} 
 
.c0 { 
  fill: #adc2ff; 
} 
 
.c1 { 
  fill: #caadff; 
} 
 
.c2 { 
  fill: #fbadff; 
} 
 
.c3 { 
  fill: #ffadd2; 
} 
 
.c4 { 
  fill: #ffbaad; 
} 
 
.c5 { 
  fill: #ffebad; 
} 
 
.c6 { 
  fill: #e2ffad; 
} 
 
.c7 { 
  fill: #b1ffad; 
} 
 
.c8 { 
  fill: #adffda; 
} 
 
.c9 { 
  fill: #adf3ff; 
} 
 
.c10 { 
  fill: #adc2ff; 
} 
 
.c11 { 
  fill: #caadff; 
}

<svg id="svg1" style="width:500px; height: 500px;" viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg" xmlns:x="http://www.w3.org/1999/xlink"> 
    <defs> 
        <symbol id="el1" width="50" height="50" viewBox="0 0 50 50"> 
            <rect x="-5" y="-5" width="60" height="60" class="str" /> 
            <line class="str " x1="-5" y1="-5" x2="55" y2="55" /> 
            <path d="M 30 -5 L -5 30 L -5 -5 Z" class="c5 str" /> 
            <circle cx="50" cy="50" r="26" class="c6 str" /> 
             <circle cx="50" cy="50" r="16" class="c10 str" /> 
        </symbol> 
        <symbol id="big1" width="100" height="100" viewBox="-50 -50 100 100"> 
            <use width="50" height="50"  href="#el1" transform=""/> 
            <use width="50" height="50"  href="#el1" transform="scale(-1, -1)"/> 
            <use width="50" height="50" href="#el1" transform="scale(-1, 1)"/> 
            <use width="50" height="50" href="#el1" transform="scale(1, -1)"/> 
        </symbol> 
        <pattern id="pat1" width="56" height="56" viewBox="0 0 200 200" patternUnits="userSpaceOnUse"> 
            <use x="0" y="0" width="100"  height="100" href="#big1" class="c1"/> 
            <use x="100" y="0" width="100"  height="100" href="#big1" class="c3"/> 
            <use x="0" y="100" width="100"  height="100" href="#big1" class="c4"/> 
            <use x="100" y="100" width="100"  height="100" href="#big1" class="c2"/> 
        </pattern> 
    </defs> 
     
    <ellipse class="str2" cx="250" cy="250" rx="200" ry="246" fill="url(#pat1)"></ellipse> 
    <text class="str2" x="50%" text-anchor="middle" y="320" width="100%" font-family="Arial" font-weight="bold" font-size="194" fill="white"> 
        ХВ 
    </text> 
</svg>

  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> 
  <path fill="#54b88b" d="M256 512c105.317 0 190.694-85.376 190.694-190.694C446.694 160.245 339.791 0 256 0S65.306 160.245 65.306 321.306C65.306 426.624 150.683 512 256 512z"/> 
  <path fill="#fbdd56" d="M256 0c-51.928 0-112.73 61.547-151.465 146.689 42.849 6.937 92.412 10.808 151.465 10.808s108.616-3.871 151.465-10.808C368.729 61.547 307.928 0 256 0z"/> 
  <path fill="#b5e489" d="M65.322 322.529C65.981 427.282 151.092 512 256 512s190.019-84.718 190.678-189.471c0 0-74.056-33.831-190.678-33.831S65.322 322.529 65.322 322.529z"/> 
  <path fill="#fff" d="M436.035 371.327c-10.841 1.967-21.948-1.5-29.716-9.267-18.918-18.916-49.695-18.917-68.613.001-6.33 6.33-14.747 9.817-23.699 9.817-8.953 0-17.37-3.486-23.7-9.817-18.918-18.916-49.695-18.916-68.613 0-13.069 13.068-34.332 13.068-47.4 0-18.918-18.915-49.696-18.917-68.612 0a33.555 33.555 0 0 1-29.717 9.267 7.447 7.447 0 0 0-3.912.34 188.965 188.965 0 0 0 4.74 14.91c14.535 1.555 29.085-3.501 39.496-13.91 13.066-13.068 34.332-13.068 47.398 0 18.917 18.914 49.695 18.916 68.614 0 13.066-13.068 34.332-13.068 47.398 0 9.164 9.163 21.348 14.21 34.308 14.21 12.959 0 25.143-5.047 34.307-14.21 13.066-13.068 34.331-13.068 47.399 0 10.41 10.409 24.958 15.465 39.495 13.91a189.439 189.439 0 0 0 4.739-14.907 7.44 7.44 0 0 0-3.912-.344zm-64.022 37.227c-12.959 0-25.143 5.047-34.307 14.21-13.066 13.069-34.331 13.067-47.399.001-9.164-9.164-21.348-14.211-34.307-14.211-12.959 0-25.143 5.047-34.306 14.21-13.068 13.069-34.332 13.067-47.4.001-9.164-9.164-21.348-14.211-34.307-14.211s-25.143 5.047-34.306 14.21a33.43 33.43 0 0 1-7.489 5.616 191.353 191.353 0 0 0 8.982 12.138 48.389 48.389 0 0 0 9.113-7.147c6.33-6.33 14.747-9.816 23.699-9.816 8.952 0 17.369 3.486 23.7 9.817 18.917 18.916 49.696 18.915 68.613-.001 6.33-6.33 14.747-9.816 23.699-9.816 8.952 0 17.369 3.486 23.7 9.817 18.914 18.915 49.695 18.917 68.613-.001 6.33-6.33 14.747-9.816 23.699-9.816s17.369 3.486 23.7 9.817a48.379 48.379 0 0 0 9.114 7.144 191.282 191.282 0 0 0 8.98-12.136 33.423 33.423 0 0 1-7.488-5.614c-9.161-9.165-21.344-14.212-34.303-14.212z"/> 
  <path fill="#f985ac" d="M256 0c-39.849 0-84.925 36.245-121.244 91.584 30.73 9.749 68.731 15.668 121.244 15.668s90.514-5.919 121.244-15.668C340.925 36.245 295.849 0 256 0z"/> 
  <g fill="#fbdd56"> 
    <circle cx="256" cy="53.626" r="21.275"/> 
    <path d="M191.542 27.026c-9.843 7.842-19.569 17.215-28.995 27.902 3.393 7.244 10.728 12.274 19.257 12.274 11.75 0 21.275-9.525 21.275-21.275-.001-8.237-4.691-15.366-11.537-18.901zm128.916 0c9.843 7.842 19.569 17.215 28.995 27.902-3.393 7.244-10.728 12.274-19.257 12.274-11.75 0-21.275-9.525-21.275-21.275.001-8.237 4.691-15.366 11.537-18.901z"/> 
  </g> 
  <path fill="#414b58" d="M188.498 225.556a7.499 7.499 0 0 1-7.5-7.5v-11.394c0-4.143 3.357-7.5 7.5-7.5s7.5 3.357 7.5 7.5v11.394a7.5 7.5 0 0 1-7.5 7.5zM256 246.005c-10.621 0-19.232-8.61-19.232-19.232v-13.982a5.25 5.25 0 0 1 5.25-5.25h27.963a5.25 5.25 0 0 1 5.25 5.25v13.982c.001 10.622-8.61 19.232-19.231 19.232zm67.502-20.449a7.499 7.499 0 0 1-7.5-7.5v-11.394c0-4.143 3.357-7.5 7.5-7.5a7.5 7.5 0 0 1 7.5 7.5v11.394a7.5 7.5 0 0 1-7.5 7.5z"/> 
  <path d="M245.489.818C163.545 13.268 65.306 166.909 65.306 321.306 65.306 426.624 150.683 512 256 512c9.39 0 18.618-.691 27.645-2.002C101.718 432.107 182.812 75.73 245.489.818z" opacity=".1"/> 
</svg>