JSFiddle - React, Tailwind, and code Playground

HTML

<div class="block-original">
   <div class="block-origina__anim">
                                                            <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="eedmm75rbkz71" viewBox="0 0 200 200" shape-rendering="geometricPrecision" text-rendering="geometricPrecision"><g id="eedmm75rbkz72" opacity="0.425000"><g id="eedmm75rbkz73"><path id="eedmm75rbkz74" d="M404.829181,70.652409C402.412689,67.683576,398.046759,67.235611,395.077926,69.652103C392.131837,72.049913,391.664378,76.372387,394.030103,79.344468C419.759444,113.757746,419.759444,161.003609,394.030103,195.416480C391.613611,198.385313,392.061576,202.751243,395.030409,205.167735C397.999241,207.584226,402.365172,207.136262,404.781663,204.167429C404.797502,204.147935,404.813342,204.128440,404.829181,204.108540C434.412318,164.541028,434.412318,110.219108,404.829181,70.652409Z" transform="matrix(1 0 0 1 -236.66015979499997 -32.40991895000001)" fill="rgb(255,255,255)" stroke="none" stroke-width="1"/></g></g><g id="eedmm75rbkz75"><g id="eedmm75rbkz76"><path id="eedmm75rbkz77" d="M86.641581,103.102975C84.497199,101.864675,81.854897,101.864675,79.710108,103.102975L32.813113,129.892729L6.931473,129.892729C3.103263,129.892729,0,132.995991,0,136.823795L0,178.411819C0,182.240029,3.103263,185.343292,6.931473,185.343292L32.813113,185.343292L79.738132,212.153759C83.062331,214.052431,87.295861,212.896982,89.194533,209.573190C89.792361,208.526585,90.106708,207.342707,90.107114,206.137304L90.107114,109.098717C90.104678,106.624961,88.783933,104.340056,86.641581,103.102975Z" transform="matrix(1 0 0 1 8 -52.62093010500003)" fill="rgb(255,255,255)" stroke="none" stroke-width="1"/></g></g><g id="eedmm75rbkz78" opacity="1"><g id="eedmm75rbkz79"><path id="eedmm75rbkz710"...

CSS

.block-original{
  background-color: #000;
}

.block-original svg,
.block-css svg{
  max-height: 200px;
}


.block-css{
  background-color: #00f;
}


.block-css #eedmm75rbkz78 {
    animation: anim1 1.4s linear infinite;
}

.block-css #eedmm75rbkz711 {
    animation: anim2 1.4s linear infinite;
}

.block-css #eedmm75rbkz72 {
    animation: anim3 1.4s linear infinite;
}

@keyframes anim1 {
    0%, 5% { opacity: 0; }
    20%, 100% { opacity: 1; }
}

@keyframes anim2 {
    0%, 35% { opacity: 0; }
    50%, 100%{ opacity: 1; }
}

@keyframes anim3 {
    0%, 65% { opacity: 0; }
    80%, 100%{ opacity: 1; }
}