Neon Sign 霓虹发光字
Neon is three stacked text-shadows at increasing blur and decreasing intensity. 霓虹感的本质是三层 text-shadow 叠加：模糊半径递增、亮度递减。
Runs live on this page. Move the pointer, click, or drag — whichever the effect listens for. 就在本页实时运行。移动鼠标、点击或拖拽——看它响应哪一种。
How it works原理拆解
The base state uses 10px, 20px and 40px pink shadows on top of each other; the midpoint of the keyframe swaps all three to teal and pushes them out further. Layering rather than a single big blur is what creates the tube-plus-halo look of real signage. 初始状态同时挂 10px、20px、40px 三层粉色投影；关键帧中点把三层整体换成青色并推得更远。之所以要分层而不是用一个大模糊，就是为了同时做出「灯管」和「光晕」两种质感。
What to change可以改的地方
- 1Add a fourth, very tight shadow (2px, white) to simulate the hot filament.
- 2Keep the flicker irregular by using a steps() timing function instead of ease-in-out.
- 1再加一层 2px 的白色紧贴投影，模拟灯丝的高光。
- 2把缓动换成 steps()，闪烁会变得不规则，更像坏掉的招牌。
Source code源码
Self-contained — paste it into any HTML file and it runs. No libraries. 完全独立——粘进任意 HTML 文件就能跑，不需要任何库。