JSFiddle - React, Tailwind, and code Playground

HTML

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 1000 1000" xml:space="preserve" enable-background="new 0 0 1000 1000">
  <g id="Layer_1"/>
  <g id="plava_lop">
    <radialGradient id="SVGID_1_" cx="518.3892" cy="369.9247" r="74.7977" gradientUnits="userSpaceOnUse">
      <stop offset="2.424240e-002" stop-color="#FFFFFF">
		<animate attributeName="offset" values="2.424240e-002;0.2606;2.424240e-002" dur="5s" repeatCount="indefinite"></animate>
	  </stop>
      <stop offset="6.112294e-002" stop-color="#F0FAFE">
		<animate attributeName="offset" values="6.112294e-002;0.2983;6.112294e-002" dur="5s" repeatCount="indefinite"></animate>
		<animate attributeName="stop-color" values="#F0FAFE;#FAFDFB;#F0FAFE" dur="5s" repeatCount="indefinite"></animate>
	  </stop>
      <stop offset="0.1318" stop-color="#CAEEFB">
		<animate attributeName="offset" values="0.1318;0.344;0.1318" dur="5s" repeatCount="indefinite"></animate>
		<animate attributeName="stop-color" values="#CAEEFB;#EBF7F0;#CAEEFB" dur="5s" repeatCount="indefinite"></animate>
	  </stop>
      <stop offset="0.2289" stop-color="#8BDAF7">
		<animate attributeName="offset" values="0.2289;0.3939;0.2289" dur="5s" repeatCount="indefinite"></animate>
		<animate attributeName="stop-color" values="#8BDAF7;#D2ECDE;#8BDAF7" dur="5s" repeatCount="indefinite"></animate>
	  </stop>
      <stop offset="0.3475" stop-color="#36BEF2">
		<animate attributeName="offset" values="0.3475;0.4468;0.3475" dur="5s" repeatCount="indefinite"></animate>
		<animate attributeName="stop-color" values="#36BEF2;#B0DEC5;#36BEF2" dur="5s" repeatCount="indefinite"></animate>
	  </stop>
      <stop offset="0.4182" stop-color="#00ADEE">
		<animate attributeName="offset" values="0.4182;0.5021;0.4182" dur="5s" repeatCount="indefinite"></animate>
		<animate attributeName="stop-color" values="#00ADEE;#84CBA5;#00ADEE" dur="5s" repeatCount="indefinite"></animate>
	  </stop>
      <stop...

CSS

<style>
.s0{
	stop-color:#FFFFFF;
}
.s1{
	stop-color:#00ADEE;
}
.s2{
	stop-color:#00ABEB;
}
.s3{
	stop-color:#000000;
}
.s4{
	stop-color:#C4C4C4;
}
.s5{
	stop-color:#717171;
}
.s6{
	stop-color:#343434;
}
.s7{
	stop-color:#0E0E0E;
}
.s8{
	stop-color:#130C0E;
}
.s9{
	stop-color:#FFFFFF;
	stop-opacity:0;
}
.s10{
	stop-color:#F6F6F6;
}
.s11{
	stop-color:#DEDEDE;
}
.s12{
	stop-color:#B6B6B6;
}
.s13{
	stop-color:#7F7F7F;
}
.s14{
	stop-color:#393939;
}
.s15{
	stop-color:#FFFFFF;
	stop-opacity:0.9419;
}
.s16{
	stop-color:#FFFFFF;
	stop-opacity:0.56;
}
.s17{
	stop-color:#DBDADB;
	stop-opacity:0.4924;
}
.s18{
	stop-color:#9A9899;
	stop-opacity:0.3598;
}
.s19{
	stop-color:#676465;
	stop-opacity:0.2395;
}
.s20{
	stop-color:#423F3F;
	stop-opacity:0.1356;
}
.s21{
	stop-color:#2B2728;
	stop-opacity:5.234122e-002;
}
.s22{
	stop-color:#231F20;
	stop-opacity:0;
}
.s23{
	stop-color:#D9D9D9;
	stop-opacity:0.917;
}
.s24{
	stop-color:#A1A1A1;
	stop-opacity:0.7773;
}
.s25{
	stop-color:#6F6F6F;
	stop-opacity:0.6372;
}
.s26{
	stop-color:#474747;
	stop-opacity:0.4998;
}
.s27{
	stop-color:#282828;
	stop-opacity:0.3656;
}
.s28{
	stop-color:#121212;
	stop-opacity:0.2356;
}
.s29{
	stop-color:#050505;
	stop-opacity:0.1116;
}
.s30{
	stop-color:#000000;
	stop-opacity:0;
}

</style>  <style type="text/css">
   ...