你的表白神助手，送给心上人的最佳礼物，浪漫又暖心！

用代码给你的爱人一场浪漫的表白！

情人节临近，你是否还在绞尽脑汁地思考如何给你的心上人一个特别的惊喜？不妨尝试用代码来表达你的爱意吧！代码不仅可以为你的表白增添一份科技感，还可以让你的爱人感受到你满满的心意。

1. 爱心雨

让代码为你心爱的人营造一场浪漫的爱心雨。代码会生成大量飘落的爱心，以不同颜色和大小随机出现。在你心上人打开网页时，代码会在她的浏览器中开始下起爱心雨，在视觉上营造出浪漫又温馨的氛围。

代码示例：

<canvas id="canvas"></canvas>

<script>
  const canvas = document.getElementById("canvas");
  const ctx = canvas.getContext("2d");

  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;

  const hearts = [];

  for (let i = 0; i < 100; i++) {
    const heart = {
      x: Math.random() * canvas.width,
      y: Math.random() * canvas.height,
      size: Math.random() * 10 + 10,
      color: `hsl(${Math.random() * 360}, 100%, 50%)`,
    };

    hearts.push(heart);
  }

  const animate = () => {
    ctx.clearRect(0, 0, canvas.width, canvas.height);

    hearts.forEach((heart) => {
      ctx.fillStyle = heart.color;
      ctx.beginPath();
      ctx.arc(heart.x, heart.y, heart.size, 0, 2 * Math.PI);
      ctx.fill();

      heart.y += 1;

      if (heart.y > canvas.height) {
        heart.y = 0;
      }
    });

    requestAnimationFrame(animate);
  };

  animate();
</script>

2. 爱心烟花

用代码让烟花绽放出爱的光芒。这个代码使用多种颜色的烟花来填满屏幕，并将你的心意幻化成璀璨的烟花，在屏幕中绽放。它会让你的心上人在打开网页的瞬间眼前一亮，留下深刻的印象。

代码示例：

<canvas id="canvas"></canvas>

<script>
  const canvas = document.getElementById("canvas");
  const ctx = canvas.getContext("2d");

  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;

  const fireworks = [];

  for (let i = 0; i < 100; i++) {
    const firework = {
      x: Math.random() * canvas.width,
      y: Math.random() * canvas.height,
      size: Math.random() * 10 + 10,
      color: `hsl(${Math.random() * 360}, 100%, 50%)`,
      speed: Math.random() * 10 + 1,
    };

    fireworks.push(firework);
  }

  const animate = () => {
    ctx.clearRect(0, 0, canvas.width, canvas.height);

    fireworks.forEach((firework) => {
      ctx.fillStyle = firework.color;
      ctx.beginPath();
      ctx.arc(firework.x, firework.y, firework.size, 0, 2 * Math.PI);
      ctx.fill();

      firework.y += firework.speed;

      if (firework.y > canvas.height) {
        firework.y = 0;
        firework.x = Math.random() * canvas.width;
      }
    });

    requestAnimationFrame(animate);
  };

  animate();
</script>

3. 爱心弹幕

用代码传达你满心的爱意，满屏的爱心将充满整个屏幕，从四个方向，不断涌来。你可以在代码中自定义弹幕的内容，将你想说的话、对Ta的赞美或深情告白用代码的形式呈现出来。当你的心上人打开网页时，这些爱心弹幕将会不断滚动，传递你的浓浓爱意。

代码示例：

<div id="container"></div>

<script>
  const container = document.getElementById("container");

  const hearts = [];

  for (let i = 0; i < 100; i++) {
    const heart = document.createElement("div");
    heart.classList.add("heart");
    heart.style.left = `${Math.random() * container.clientWidth}px`;
    heart.style.top = `${Math.random() * container.clientHeight}px`;
    heart.style.animationDelay = `${Math.random() * 10}s`;

    hearts.push(heart);
    container.appendChild(heart);
  }
</script>

4. 爱心粒子

这个代码就像把爱的心愿散播到了整个宇宙，无数闪闪发光的爱心粒子在太空中漫天飞舞。当你的心上人打开网页时，它们会像是被她的魅力吸引，从四面八方汇聚到屏幕中间，形成一颗巨大的爱心。这个效果唯美又浪漫，让人有身处太空的错觉。

代码示例：

<canvas id="canvas"></canvas>

<script>
  const canvas = document.getElementById("canvas");
  const ctx = canvas.getContext("2d");

  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;

  const particles = [];

  for (let i = 0; i < 1000; i++) {
    const particle = {
      x: Math.random() * canvas.width,
      y: Math.random() * canvas.height,
      size: Math.random() * 5 + 1,
      color: `hsl(${Math.random() * 360}, 100%, 50%)`,
      speed: Math.random() * 1 + 0.5,
    };

    particles.push(particle);
  }

  const animate = () => {
    ctx.clearRect(0, 0, canvas.width, canvas.height);

    particles.forEach((particle) => {
      ctx.fillStyle = particle.color;
      ctx.beginPath();
      ctx.arc(particle.x, particle.y, particle.size, 0, 2 * Math.PI);
      ctx.fill();

      particle.x += particle.speed;
      particle.y += particle.speed;

      if (particle.x > canvas.width || particle.x < 0) {
        particle.speed *= -1;
      }

      if (particle.y > canvas.height || particle.y < 0) {
        particle.speed *= -1;
      }
    });

    requestAnimationFrame(animate);
  };

  animate();
</script>

5. 爱心魔法阵

代码让代码化身为你爱的魔法阵，巨大的魔法阵悬浮在屏幕上，内部闪烁着五彩斑斓的光芒。爱心魔法阵可以根据你的喜好自定义魔法图案，如玫瑰、红心、丘比特等，并在爱心魔法阵的周围环绕着闪闪发光的星光。当你的心上人打开网页时，魔法阵将开始旋转，并在屏幕上留下绚丽的轨迹。

代码示例：

<canvas id="canvas"></canvas>

<script>
  const canvas = document.getElementById("canvas");
  const ctx = canvas.getContext("2d");

  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;

  const magicCircle = {
    x: canvas.width / 2,
    y: canvas.height / 2,
    radius: canvas.width / 2,
    color: `hsl(${Math.random() * 360}, 100%, 50%)`,
  };

  const stars = [];

  for (let i = 0; i < 100; i++) {
    const star = {
      x: Math.random() * canvas.width,
      y: Math.random() * canvas.height,
      size: Math.random() * 5 + 1,
      color: `hsl(${Math.random() * 360}, 100%, 50%)`,
    };

    stars.push(star);
  }

  const animate = () => {
    ctx.clearRect(0, 0, canvas.width, canvas.height);

    ctx.fillStyle = magicCircle.color;
    ctx.beginPath();
    ctx.arc(magicCircle.x, magicCircle.