在线文本阴影 CSS 生成器
为您的网站创建令人惊叹的渐变文本效果
Controls
2
2
4
50
多个阴影
Shadow 2
热门预设
Preview
文本阴影演示
已复制到剪贴板！
关于Text Shadow Generator
易于使用
使用我们直观的界面生成漂亮的文本阴影。无需 CSS 知识！
完全响应式
可在所有设备上完美运行，从手机到台式电脑。
干净的、生产就绪的CSS代码，您可以立即在您的项目中使用。
如何使用文本阴影生成器
1
调整滑块
修改水平偏移、垂直偏移、模糊半径和不透明度以创建完美的阴影。
2
选择颜色
使用颜色选择器或十六进制代码输入为您的文本阴影选择任何颜色。
3
预览您的设计
通过我们的交互式预览实时查看文本阴影的外观。
4
复制 CSS
单击复制按钮以获取生成的 CSS 代码并在项目中使用它。
常用文本阴影示例
霓虹灯发光效果
霓虹灯发光效果
text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #0073e6, 0 0 20px #0073e6, 0 0 25px #0073e6;
3D 文本效果
3D 文字效果
text-shadow: 1px 1px 0px #c4c4c4, 2px 2px 0px #c4c4c4, 3px 3px 0px #c4c4c4, 4px 4px 0px #c4c4c4;
微妙的阴影
微妙的阴影
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25);
内阴影
内阴影
text-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.5);