<div class="container">
  <div class="content">543.62</div>
  <svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg" width="100%" id="blobSvg">
    <defs>
      <linearGradient id="path1-a" x1="50%" x2="50%" y1="0%" y2="100%">
        <stop offset="0%" stop-color="#1AD8FF" />
        <stop offset="100%" stop-color="#1AD8FF" />
      </linearGradient>
    </defs>
    <path id="blob" fill="url(#path1-a)" fill-rule="evenodd">
      <animate attributeName="d" dur="2s" repeatCount="indefinite" fill="freeze" values="M408,363Q323,476,186.5,435.5Q50,395,50,250Q50,105,187,63.5Q324,22,408.5,136Q493,250,408,363Z; 
                       M406.5,360.5Q322,471,187,432.5Q52,394,53,251Q54,108,188,69Q322,30,406.5,140Q491,250,406.5,360.5Z;
                       M403.5,364Q324,478,195,431Q66,384,57.5,244Q49,104,185.5,66.5Q322,29,402.5,139.5Q483,250,403.5,364Z; 
                       M407,361.5Q322,473,185,435Q48,397,49.5,251.5Q51,106,187,65Q323,24,407.5,137Q492,250,407,361.5Z" />
    </path>
  </svg>
</div>
@import url("https://fonts.googleapis.com/css2?family=Exo:wght@600&display=swap");

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  width: 100vw;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "Exo", Arial, sans-serif;
  font-size: 20px;
  font-weight: 600;
  background: radial-gradient(50% 100%, #00acfe 0%, #006eff 0%, #2b9fff 100%),
    linear-gradient(180deg, #006eff 0%, #00c2ff 100%);
}

.container {
  width: 420px;
  height: 420px;
  position: relative;
  margin: auto;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.content {
  background-color: #d8f3fe;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 320px;
  height: 320px;
  color: #0044cd;
  font-size: 2.5rem;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
  position: relative;
  z-index: 2;
}

svg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.