✨Effect Lab
Read the full guide完整技术长文 When text stops being text当文字不再是文字
🔤

Particle Text 粒子文字

A burst of 40 particles every 600ms from the centre, their velocity randomised over a full 360 degrees. 每 600ms 从中心炸出 40 个粒子,速度方向在整圆上随机。

Canvas 2DRadial burstInterval spawner
Live demo实时演示

Runs live on this page. Move the pointer, click, or drag — whichever the effect listens for. 就在本页实时运行。移动鼠标、点击或拖拽——看它响应哪一种。

How it works原理拆解

This one leans on the canvas's own persistence: nothing is cleared between frames, so old particles leave a glowing smear that slowly accumulates into a cloud. Life l is unused for drawing size and only gates the fade — the visual weight comes from stacking. 这个效果吃的是 Canvas 自身的累积:帧间不清屏,老粒子留下的残影会慢慢堆成一团光雾。寿命 l 只用来控制淡出,粒子的大小是固定的——视觉厚度完全来自叠加。

What to change可以改的地方

  • 1Clear the canvas partially (rgba(0,0,0,0.1)) to trade the smear for crisp dots.
  • 2Lower the interval to 200ms and raise the count to fill the canvas much faster.
  • 1如果每帧先盖一层 rgba(0,0,0,0.1),残影会消失,变成干净的小点。
  • 2间隔缩到 200ms、数量提上去,画面会瞬间填满。

Source code源码

Self-contained — paste it into any HTML file and it runs. No libraries. 完全独立——粘进任意 HTML 文件就能跑,不需要任何库。

particleText.html