JSFiddle - React, Tailwind, and code Playground

HTML

<!-- Белый фон, анимация на МИФ-->
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 width="250px" height="250px" viewBox="199.728 300.73 82.394 82.39" enable-background="new 199.728 300.73 82.394 82.39" class="square"
	 xml:space="preserve">
<g style="fill:#fff;">
	<path d="M255.409,341.682c0,1.958,1.037,3.021,3.402,3.07v-6.136C256.35,338.689,255.409,340.039,255.409,341.682z"/>
	<path d="M262.676,338.616v6.136c2.536-0.05,3.454-1.092,3.454-3.07C266.13,340.086,265.259,338.689,262.676,338.616z"/>
	<path d="M199.728,300.73v82.39h82.394v-82.39H199.728z M229.29,350.376h-3.864v-10.771l-4.705,6.593h-0.557l-4.684-6.52v10.697
		h-3.863v-16.899h3.887l5.218,7.121l4.925-7.121h3.645L229.29,350.376L229.29,350.376z M248.385,350.376h-3.861v-10.504
		l-7.485,10.504h-3.379v-16.899h3.863v10.499l7.483-10.499h3.379V350.376z M262.676,348.298v2.271h-3.863v-2.271
		c-4.516-0.045-7.507-2.39-7.507-6.616c0-4.175,3.062-6.492,7.507-6.612v-1.788h3.863v1.788c4.396,0.093,7.558,2.484,7.558,6.612
C270.232,345.885,267.165,348.253,262.676,348.298z"/>
</g>
</svg>

CSS

body {
    width: 100%;
    height: 100%;
    background: #fff;
}
.square {
    -webkit-animation: rainbow 20s infinite;
    -moz-animation: rainbow 20s infinite;
    animation: rainbow 20s infinite;
}
@-webkit-keyframes rainbow {
    0% {
        background: #000000;
    }
    14.3% {
        background: #B22222;
    }
    28.6% {
        background: #D2691E;
    }
    42.9% {
        background: #DAA520;
    }
    57.2% {
        background: #228B22;
    }
    71.5% {
        background: #008080;
    }
    85.8% {
        background: #4682B4;
    }
    100% {
        background: #000000;
    }
}

@-moz-keyframes rainbow {
    0% {
        background: #000000;
    }
    14.3% {
        background: #B22222;
    }
    28.6% {
        background: #D2691E;
    }
    42.9% {
        background: #DAA520;
    }
    57.2% {
        background: #228B22;
    }
    71.5% {
        background: #008080;
    }
    85.8% {
        background: #4682B4;
    }
    100% {
        background: #000000;
    }
}

@keyframes rainbow {
    0% {
        background: #000000;
    }
    14.3% {
        background: #B22222;
    }
    28.6% {
        background: #D2691E;
    }
    42.9% {
        background: #DAA520;
    }
    57.2% {
        background: #228B22;
    }
    71.5% {
        background: #008080;
    }
    85.8% {
        background: #4682B4;
    }
    100% {
        background: #000000;
    }
}