CSS 文字阴影生成器

CSS 的 text-shadow 属性会在文字后面绘制一个或多个模糊或清晰的副本。单层可以让标题在照片上更突出；多层则能做出描边、霓虹发光、3D 立体字和复古错位效果。整个过程不需要图片，文字仍可选中，任何字号下都清晰。这个生成器会写出属性值，检查你添加的额外图层，并在你自己的浏览器中渲染结果。

使用方法

1. 选择一个预设，或保持“自定义”并设置偏移、模糊、颜色和不透明度。
2. 用“预设大小”让描边更粗、发光更大或 3D 文字更深。
3. 想组合效果时，每行添加一个额外图层。
4. 把预览文字和颜色调整成与你的页面一致，然后复制这行 CSS。

计算公式

text-shadow: <x> <y> [<blur>] <color> [, more layers]

x 为正时阴影向右移动，y 为正时向下移动；模糊让阴影变柔和，且不能为负。与 box-shadow 不同，它没有 spread 和 inset。描边预设会在每个方向上相距“预设大小”的位置放置 8 个清晰副本；3D 挤出则每 1 px 深度叠加一个副本。

示例

默认值——向右 2 px、向下 2 px、模糊 4 px、40% 不透明度的黑色——得到 text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);，是一个柔和的投影。硬阴影预设取 3 px、番茄红色时为 3px 3px 0 #ff6347；1 px 的描边需要 8 个图层，例如 -1px -1px 0 #000000 和 1px 1px 0 #000000。