霓虹光圈

前端教程SVG实用案例

效果预览

新窗口打开

实现说明

此特效使用了以下 SVG 知识：

• <path> <circle> <ellipse> <rect> 图形元素的使用；
• <linearGradient> <radialGradient> 渐变元素的使用；
• <animateMotion> <animate> 动画元素的使用；
• mix-blend-mode: color-dodge 混合。

其中关键点在于 mix-blend-mode: color-dodge。