CSS 文字阴影生成器
免费在线 CSS text-shadow 生成器。多层阴影可调偏移、模糊、颜色与透明度，内置霓虹、3D、复古、光晕等预设，实时预览并一键复制代码。
CSS 的 text-shadow 属性是什么？
text-shadow 用于给文字字形添加阴影效果。每个阴影由水平偏移、垂直偏移、可选的模糊半径和颜色定义，多个阴影可以用逗号分隔写在同一条属性里，组合出丰富的效果。
多层阴影是怎么工作的？
阴影按声明顺序从下往上绘制，列表中第一个阴影显示在最上层。本生成器支持添加、删除、启用和停用图层，每层都有独立的偏移、模糊、颜色和透明度，方便叠加霓虹、3D 等效果。
水平偏移、垂直偏移和模糊分别是什么意思？
水平偏移让阴影相对文字左右移动，垂直偏移上下移动，模糊半径决定边缘柔化程度：0 是硬边阴影（复古、描边风格），较大的值会把颜色晕开形成光晕。
怎么做霓虹发光效果？
使用 Neon 预设，或把多层阴影的偏移都设为 0、使用同一个亮色并逐层增大模糊值，例如 0 0 3px、0 0 8px、0 0 20px。叠出的光晕可以模拟霓虹灯管。
text-shadow 会影响渲染性能吗？
少量静态阴影开销很小，但带大量大模糊阴影的文字重绘成本更高。把很重的阴影用在长段落或持续做 text-shadow 动画，可能在低端设备和手机上掉帧；建议只用于短标题、控制模糊值，或改用透明度动画。
怎么让阴影半透明？
每个图层都有不透明度滑杆，会把所选颜色转换为 rgba 写法，例如 rgba(0, 0, 0, 0.5)。半透明阴影能和任何背景自然融合，Paper 预设就是用它实现柔和的压印感。
text-shadow 和 box-shadow 有什么区别？
text-shadow 作用于文字字形，没有扩展（spread）和内阴影（inset）参数；box-shadow 作用于元素的矩形盒子。两者共享偏移和模糊的语法，但不能互相替代。
哪些浏览器支持 text-shadow？
所有现代浏览器都支持 text-shadow，包括 Chrome、Firefox、Safari、Edge 和 Opera，十多年前就已去掉前缀并稳定。多层阴影在各浏览器中表现一致。
输入的内容会被上传到服务器吗？
不会。预览文字和所有图层配置都保存在你的浏览器里，CSS 在页面本地生成。任何数据都不经过网络，页面加载后离线也能使用。
如何使用CSS 文字阴影生成器
用多层叠加的方式设计 CSS 文字阴影，告别只猜一组数值。所有改动都实时反映在大字号预览上，CSS 完全在浏览器本地生成。
- 在“预览文字”输入框里填上你自己的文案，用真实内容检验效果。
- 先试预设：霓虹、纸张、3D、复古、光晕、描边，一键载入现成的多层参数。
- 用每个图层的滑杆调整水平偏移、垂直偏移、模糊、颜色和不透明度。
- 点“添加图层”继续叠加阴影；取消勾选可临时停用某层，点垃圾桶图标删除。
- 复制生成的 text-shadow 规则，粘贴到样式表中即可使用。
霓虹效果用同色三四层、模糊逐层增大最出彩——把偏移保持为 0，让模糊负责发光。
相关工具
- CSS 阴影生成器 免费在线 CSS box-shadow 生成器。可视化创建精美阴影，可调整偏移、模糊、扩展、颜色和内阴影。实时预览，即时复制代码。
- CSS 渐变生成器 可视化创建精美 CSS 渐变。生成支持多色标、自定义角度和位置的线性、径向和锥形渐变。即时复制可投入生产的 CSS 代码。
- 花式字体生成器 免费花式字体生成器，内置28种Unicode字体风格。一键生成粗体、斜体、哥特体、圆圈字等特殊文字，适用于Instagram签名、TikTok、微信和游戏昵称，点击即复制。
- 创意圆角生成器 免费在线创意圆角生成器。拖拽 8 个手柄或选择 blob 预设，快速创建有机 CSS 形状并复制 border-radius 代码。
- 颜色转换器 免费在线颜色转换器。即时转换 HEX、RGB、HSL、HSV 格式，带可视化拾色器。100% 隐私保护，浏览器本地运行。
- CSS 缓动函数生成器 免费在线 CSS 缓动生成器。在交互曲线上拖拽 cubic-bezier 控制点，内置 18 种预设，小球循环动画实时对比，一键复制 timing function。
- CSS clip-path 裁剪生成器 免费在线 CSS clip-path 生成器。支持 polygon、circle、ellipse、inset 四种模式，顶点可拖拽，实时预览并一键复制 CSS 代码。
- CSS格式化工具 即时格式化和美化CSS代码，将压缩的CSS转换为可读的、缩进良好的代码，支持自定义选项。