用前端代码帮我画一个皮卡丘

很乐意帮你画一个皮卡丘！以下是使用 HTML、CSS 和 JavaScript 代码绘制的简单皮卡丘：

HTML 代码：

<div class="pikachu">
  <div class="ear left"></div>
  <div class="ear right"></div>
  <div class="face">
    <div class="eye left"></div>
    <div class="eye right"></div>
    <div class="nose"></div>
    <div class="mouth"></div>
    <div class="cheek left"></div>
    <div class="cheek right"></div>
  </div>
</div>

CSS 代码：

.pikachu {
  width: 200px;
  height: 200px;
  position: relative;
  border-radius: 50%;
  background: #ffde00;
  box-shadow: 0 0 10px #000;
}

.ear {
  width: 60px;
  height: 80px;
  position: absolute;
  top: -50px;
  border-radius: 50% 50% 0 0;
  background: #ffde00;
  box-shadow: 0 0 10px #000;
}

.left {
  left: 30px;
  transform: rotate(-45deg);
}

.right {
  right: 30px;
  transform: rotate(45deg);
}

.face {
  width: 160px;
  height: 120px;
  position: absolute;
  top: 50px;
  left: 20px;
  border-radius: 50%;
  background: #ffde00;
  box-shadow: 0 0 10px #000;
}

.eye {
  width: 30px;
  height: 30px;
  position: absolute;
  top: 40px;
  border-radius: 50%;
  background: #000;
}

.left {
  left: 40px;
}

.right {
  right: 40px;
}

.nose {
  width: 10px;
  height: 10px;
  position: absolute;
  top: 60px;
  left: 75px;
  border-radius: 50%;
  background: #000;
}

.mouth {
  width: 80px;
  height: 20px;
  position: absolute;
  top: 80px;
  left: 40px;
  border-radius: 0 0 50% 50%;
  background: #000;
}

.cheek {
  width: 40px;
  height: 40px;
  position: absolute;
  top: 70px;
  border-radius: 50%;
  background: #ff9494;
}

.left {
  left: -10px;
}

.right {
  right: -10px;
}

JavaScript 代码：

// 为了让皮卡丘动起来，我们可以使用 JavaScript 动画
// 这里使用了一个简单的定时器实现动画效果

var face = document.querySelector('.face');
var cheekLeft = document.querySelector('.cheek.left');
var cheekRight = document.querySelector('.cheek.right');

setInterval(function() {
  // 生成随机数，控制脸部表情
  var random = Math.random();
  if (random > 0.5) {
    face.style.transform = 'rotate(5deg)';
  } else {
    face.style.transform = 'rotate(-5deg)';
  }

  // 生成随机数，控制脸部红晕
  var random2 = Math.random();
  cheekLeft.style.opacity = random2;
  cheekRight.style.opacity = random2;
}, 1000);

这段代码将生成一个黄色的皮卡丘，带有两只黑色眼睛、黑色鼻子、黑色嘴巴和两颗红晕。当定时器每秒触发时，皮卡丘的脸部表情和红晕将随机变化。