✨ 发光效果设置
👁️ 实时预览
发光效果
📝 CSS代码
使用说明
CSS发光效果生成器帮助你快速创建box-shadow和text-shadow发光效果。选择发光类型，调整颜色、模糊半径、扩散距离等参数，实时预览效果并一键复制CSS代码。
Box Shadow发光：为HTML元素添加外发光效果，常用于卡片、按钮等组件。
Text Shadow发光：为文字添加发光效果，常用于标题、霓虹灯风格文字。
多层发光：增加层数可以叠加多个不同模糊半径的阴影，产生更丰富的发光效果。
常见问题
CSS发光效果和阴影有什么区别？
发光效果本质上是box-shadow或text-shadow的一种应用，通过设置较大的模糊半径和较小的偏移量来实现。普通阴影偏移量大、模糊小，发光效果偏移量为0、模糊大。
如何实现霓虹灯效果？
使用多层发光，每层逐渐增大模糊半径并降低透明度。例如：第一层blur:10px opacity:0.8，第二层blur:20px opacity:0.4，第三层blur:40px opacity:0.2。
发光效果会影响页面性能吗？
大面积的box-shadow确实会影响渲染性能，特别是在移动设备上。建议控制模糊半径在30px以内，层数不超过3层，并避免在大量元素上同时使用。
浏览器兼容性如何？
box-shadow和text-shadow在所有现代浏览器中都得到良好支持，包括Chrome、Firefox、Safari、Edge。IE9+部分支持box-shadow。