<div class="critter"></div>
body  {
  margin:0;
  height:100vh;
  display:grid;
  place-items:center;
  background:#e6e6e6;
}
.critter {
  width: 250px;
  height: 225px;
  margin:50px 0 0;
  position:relative;
  --c:#78c800;
  --c1:#f49000;
  --c2:#8ee000;
  --c3:#fff;
  --c4:#4b4b4b;
  background:
    radial-gradient(farthest-side,var(--c3) 98%,#0000 ) 62.5% 27.5%/7% 8%,
    radial-gradient(farthest-side,var(--c3) 98%,#0000 ) 28.5% 27.5%/7% 8%,
    linear-gradient(var(--c4) 0 0)33% 32%/9% 8%,
    linear-gradient(var(--c4) 0 0)68% 32%/9% 8%,
    radial-gradient(farthest-side,var(--c4) 98%,#0000)68% 36.5%/9% 9%,
    radial-gradient(farthest-side,var(--c4) 98%,#0000)68% 29%/9% 9%,
    radial-gradient(farthest-side,var(--c4) 98%,#0000)33% 29%/9% 9%,
    radial-gradient(farthest-side,var(--c4) 98%,#0000)33% 36.5%/9% 9%,
    radial-gradient(farthest-side at bottom,var(--c2) 98%,#0000) 24.5% 11.5%/7% 10%,
    radial-gradient(farthest-side at bottom,var(--c2) 98%,#0000) 75.5% 11.5%/7% 10%,
    radial-gradient(farthest-side at bottom,var(--c2) 98%,#0000) 69% 9%/5% 10%,
    radial-gradient(farthest-side at bottom,var(--c2) 98%,#0000) 31% 9%/5% 10%,
    linear-gradient(to top right,var(--c2) 49.5%,#0000 50%) 36% 9%/10% 12%,
    linear-gradient(to top left ,var(--c2) 49.5%,#0000 50%) 64% 9%/10% 12%,
    radial-gradient(farthest-side,var(--c3) 94%,#0000 ) 62.5% 27.5%/7% 8%,
    linear-gradient(var(--c3) 0 0) 72% 32%/20% 7%,
    linear-gradient(var(--c3) 0 0) 28% 32%/20% 7%,
    radial-gradient(farthest-side,var(--c3) 98%,#0000 )72% 33.5%/20% 23%,
    radial-gradient(farthest-side,var(--c3) 98%,#0000 )72% 25.5%/20% 23%,
    radial-gradient(farthest-side,var(--c3) 98%,#0000 )28% 25.5%/20% 23%,
    radial-gradient(farthest-side,var(--c3) 98%,#0000 )28% 33.5%/20% 23%,
    radial-gradient(farthest-side at bottom,#ffc200 98%,#0000)50% 42.5%/14% 8%,
    radial-gradient(farthest-side,var(--c1) 98%,#0000)50% 45%/10% 11%,
    radial-gradient(71% 94% at top,#0000 76%,var(--c2) 79% ) 50% 15%/21% 13%,
    radial-gradient(farthest-side,var(--c2) 98%,#0000 ) 24.5% 19%/27% 26%,
    radial-gradient(farthest-side,var(--c2) 98%,#0000 ) 75.5% 19%/27% 26%,
    radial-gradient(farthest-side,var(--c2) 98%,#0000 ) 75.5% 38%/27% 26%,
    radial-gradient(farthest-side,var(--c2) 98%,#0000 ) 24.5% 38%/27% 26%,
    linear-gradient(var(--c2) 0 0) 50% 31%/64% 17%,
    radial-gradient(farthest-side at top,var(--c2) 98%,#0000 0) 41% 71%/11% 6%,
    radial-gradient(farthest-side at top,var(--c2) 98%,#0000 0) 59% 71%/11% 6%,
    radial-gradient(farthest-side at top,var(--c2) 98%,#0000 0) 50% 80%/11% 6%,
    linear-gradient(to top left ,var(--c) 50%,#0000 50.5%)62% 0%/28% 11%,
    linear-gradient(to top right,var(--c) 50%,#0000 50.5%)37% 0%/28% 11%,
    linear-gradient(to top left ,var(--c) 50%,#0000 50.5%)0% 67.5%/15% 30%,
    linear-gradient(to top right,var(--c) 50%,#0000 50.5%)100% 67.5%/15% 30%,
    linear-gradient(var(--c) 0 0)50% 9%/30% 5%,
    radial-gradient(farthest-side,var(--c) 98%,#0000) 18% 0%/22% 26%,
    radial-gradient(farthest-side,var(--c) 98%,#0000) 82% 0%/22% 26%,
    radial-gradient(47% 100% at top,var(--c) 98%,#0000 )50% 93%/72% 34%,
    radial-gradient(50% 100% at 50% 0%,var(--c) 98%,#0000 )104% 82%/28% 6%,
    radial-gradient(50% 100% at 50% 0%,var(--c) 98%,#0000 )-4% 82%/28% 6%,
    linear-gradient(var(--c) 0 0) 50% 38%/72% 67%,
    radial-gradient(farthest-side,var(--c1) 98%,#0000 0) 35.5% 101%/10% 12%,     
    radial-gradient(farthest-side,var(--c1) 98%,#0000 0) 43% 101%/10% 12%,
    radial-gradient(farthest-side,var(--c1) 98%,#0000 0) 57% 101%/10% 12%,
    radial-gradient(farthest-side,var(--c1) 98%,#0000 0) 64.5% 101%/10% 12%,
    linear-gradient(var(--c1) 0 0) 40% 102%/5% 5%,
    linear-gradient(var(--c1) 0 0) 60% 102%/5% 5%;
   background-repeat: no-repeat;
}
.critter:after {
   content: "Let’s\00a0learn\00a0some Japanese?";
   position: absolute;
   left: 100%;
   bottom: 80%;
   text-align: center;
   font-size: 28px;
   font-weight: bold;
   font-family: sans-serif;
   padding: 10px;
   background: #fff;
   border-radius: 20px;
}
.critter:before {
   content: "";
   position: absolute;
   width: 50px;
   height: 61px;
   left: 114%;
   bottom: 60%;
   transform-origin: top;
   transform: skewX(-53deg);
   background: #fff;
   clip-path: polygon(0 0,100% 0,50% 100%);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.