JSFiddle - React, Tailwind, and code Playground
HTML
<div id="wykop">
<div id="ramka"></div>
<div id="srodek"></div>
<div id="w1"></div>
<div id="w2"></div>
<div id="w3"></div>
<div id="w"></div>
</div>
CSS
#wykop{
-webkit-transform-origin: 200px 200px;
-moz-transform-origin: 200px 200px;
}
#ramka {
width: 400px;
height: 400px;
background-color: #327da5;
border-radius: 80px;
}
#srodek {
position: absolute;
top: 50px;
left: 50px;
width: 310px;
height: 310px;
background-color: white;
border-radius: 60px;
}
#w1 {
background-color: #f3813a;
width: 50px;
height: 150px;
position: absolute;
top: 150px;
left: 120px;
-webkit-transform:rotate(-25deg);
}
#w2 {
background-color: #f3813a;
width: 50px;
height: 150px;
position: absolute;
top: 120px;
left: 185px;
-webkit-transform:rotate(-25deg);
}
#w3 {
background-color: #f3813a;
width: 50px;
height: 150px;
position: absolute;
top: 90px;
left: 250px;
-webkit-transform:rotate(-25deg);
}
#w {
background-color: #f3813a;
width: 30px;
height: 193px;
position: absolute;
top: 160px;
left: 224px;
-webkit-transform:rotate(65deg);
}
JavaScript
var rot = 0;
setInterval(function(){
rot += 0.15;
$('#wykop').css('transform', 'rotate('+rot+'deg)')
}, 60/1000)