文字阴影生成器

使用方法

1. 从预设开始 — 选择柔和、硬描边、霓虹发光、复古 3D 或浮雕，载入现成的图层组合；也可以从默认的单个柔和阴影开始。
2. 选中图层 — 点击列表中的任意图层进行编辑；选中的图层会高亮，其数值会载入下方的编辑器。
3. 调整参数 — 用滑块调节水平/垂直偏移、模糊半径、颜色和不透明度，预览和 CSS 输出会即时更新。
4. 叠加并排序图层 — 添加图层制造纵深效果，再用上移/下移调整顺序。越靠前的图层绘制在越上层，这正是发光和 3D 堆叠效果的关键。
5. 检查两种背景 — 在明暗背景之间切换，并拖动字号滑块，确认阴影在真实尺寸下的表现。
6. 复制 CSS — 点击”复制 CSS”，把 text-shadow 声明粘贴到你的样式表中。模糊为 0 的图层会省略模糊分量，输出保持简洁。

功能特点

• 多图层编辑 — 添加、删除、选中并重新排序任意数量的阴影图层，每层独立控制偏移、模糊、颜色和不透明度。
• 五个手工调好的预设 — 柔和、硬描边、霓虹发光、复古 3D、浮雕，覆盖常见效果的可靠起点。
• 明暗预览 — 两档背景切换加上字号滑块，以用户实际看到的样子呈现阴影。
• 简洁的 CSS 输出 — 图层按堆叠顺序用逗号连接；不透明度为 1 时输出十六进制颜色，否则输出 rgba()；模糊为 0 时自动省略。
• 100% 客户端运行 — 所有计算都在浏览器中完成，数据不会离开你的设备。

使用场景

• 标题纵深感： 叠加几层零模糊、逐级偏移的图层（复古 3D 预设），让主标题呈现凸版印刷或复古海报的质感。
• 发光效果： 在深色模式的落地页、直播界面和游戏 UI 中使用霓虹发光预设，再把色相调成你的品牌色。
• 图片上的可读文字： 白色文字后加一层柔和的深色阴影，无需厚重遮罩也能让照片上的说明文字保持清晰。
• 拟物化 UI： 浮雕预设可以模拟工具栏和按钮上凹陷的文字，适合实体面板风格的界面。

相关工具

• CSS 盒阴影生成器 — 实时预览设计多层盒阴影。
• CSS Flexbox 生成器 — 可视化设计 Flexbox 布局并复制 CSS。
• CSS 渐变生成器 — 为布局构建自定义 CSS 渐变。