<html>
  <body>
  <div class="person">
    <div class="head">
      
    </div>
    <div class="head2">
      
    </div>
    <div class="flex">
    <div class="shirt"></div>
      <div class="center"></div>
      <div class="black"></div>
      <div class="black3"></div>
      <div class="shirt-right"></div>
      <div class="black2"></div>
    </div>
    <div class="hand"></div>
    <div class="whole-hand"><div class="palm"></div>
    <div class="finger"></div>
    <div class="finger1"></div>
    <div class="finger2"></div>
    <div class="finger3"></div>
      <div class="finger4"></div></div>
    <div class="pant">
      <div class="side1">
      </div>
      <div class="black4"></div>
      <div class="black5"></div>
      <div class="side2">
      </div>
    </div>
    <div class="shoe">
    </div>
   <div class="shoe1">
    </div>
    </div>
  </body>
</html>
body{
  background-color:black;
    display:flex;
  justify-content:center;
  
}
.shirt{
  border:0.4px solid white;
  display:block;
  width:47px; 
 height:170px;
  border-radius:40px 0px 0px 0px;
  background-color:black
  
}
.shirt-right{
  border:1px solid white;
  display:block;
  width:47px; 
 height:170px;
  border-radius:0px 40px 0px 0px;
  background-color:black;
  
}
.person{
  margin-top:5%;
  display:flex;
  position:relative;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.center{
   display:block;
  width:50px; 
 height:144px;
  background-color:white;
}
.flex{
  display:flex;
  align-items:center;
 
}
.head{
  display:block;
  width:57px; 
 height:74px;
  background-color:white;
  border-radius:20px;
  margin-bottom:8px;
}
.head2{
  display:block;
  width:57px; 
 height:64px;
  background-color:black;
  border-radius:18px 18px 0 0;
  position:absolute;
  top:10px;
}
.black{
  display:block;
  width:20px;
  height:180px;
  top:154px;
  position:absolute;
  background-color:black;
}
.black2{
  display:block;
  width:20px;
  height:80px;
  right:0;
  top:174px;
  position:absolute;
  background-color:black;
}

.black3{
  display:block;
  width:56px;
  height:30px;
  right:46px;
  top:70px;
    border-radius:40%;
  position:absolute;
  background-color:black;
  z-index:0;
}
.black4{
   display:block;
  width:26px;
  height:67px;
  right:30px;
  top:0px;
    border-radius:40%;
  position:absolute;
  background-color:black;
  z-index:3;
}
.pant{
  display:flex;
  position:absolute;
  top:240px;
  z-index:-1;
  
}
.side1{
   border:1px solid white;
  display:block;
  width:47px; 
 height:266px;
  transform:skew(-1deg);
}
.side2{
 border:1px solid white;
  display:block;
  width:47px; 
 height:266px; 
  z-index:2;
  background-color:black;
  transform:skew(1deg);
  animation:leg1 2s infinite;
  animation-delay:1s;
}
.shoe{
   display:block;
  width:34px; 
 height:24px;
  background-color:white;
  position:absolute;
  bottom:-279px;
  border-radius:0px 0 50% 50%;
  left:29px;
  
}
.shoe1{
  display:block;
  width:34px; 
 height:24px;
  background-color:white;
  position:absolute;
  bottom:-279px;
  border-radius:0px 0 50% 50%;
  right:29px;
}
.palm{
  display:block;
  width:25px; 
 height:104px;
  border-left:2px solid white;
  position:absolute;
  transform:rotate(-32deg);
  top:112px;
  border-radius:0% 30% 50% 50%;
  left:-35px;
}
.finger{
   display:block;
  width:5px; 
 height:18px;
  border-right:2px solid white;
  position:absolute;
  transform:rotate(-8deg);
  top:86px;
   border-top:1px solid white;
  border-radius:30% 30% 50% 50%;
  left:-49px;
}
.finger1{
   display:block;
  width:3px; 
 height:26px;
  border-right:2px solid white;
  border-top:1px solid white;
  position:absolute;
  transform:rotate(-20deg);
  top:70px;
  border-radius:30% 30% 50% 50%;
  left:-62px;
}
.finger2{
   display:block;
  width:3px; 
 height:28px;
  border-right:2px solid white;
  border-top:1px solid white;
  position:absolute;
  transform:rotate(-20deg);
  top:67px;
  border-radius:30% 30% 50% 50%;
  left:-72px;
}
.finger3{
   display:block;
  width:3px; 
 height:26px;
  border-right:2px solid white;
  border-top:1px solid white;
  position:absolute;
  transform:rotate(-20deg);
  top:73px;
  border-radius:30% 30% 50% 50%;
  left:-80px;
}
.finger4{
   display:block;
  width:3px; 
 height:20px;
  border-right:2px solid white;
  border-top:1px solid white;
  position:absolute;
  transform:rotate(-20deg);
  top:85px;
  border-radius:30% 30% 50% 50%;
  left:-85px;
}
.whole-hand{
  animation: hand 1s infinite;
  position:absolute;
  top:-5px;
  left:6px;
}
@keyframes hand{

  from{
    transform:rotate(12deg);
       left:27px;
  }
    to{
    transform:rotate(-6deg);
       left:-30px;
  }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.