UD5工具箱
第一步：选择渐变类型。打开工具后，您会在参数面板顶部看到三个渐变类型选项卡：线性渐变、径向渐变和锥形渐变。点击相应的选项卡切换渐变模式。默认选中线性渐变，这是网页设计中最常用的渐变类型。
第二步：设置渐变方向或形状。对于线性渐变，您可以使用角度滑块或直接输入角度值（0-360度）来控制渐变方向。0度表示从下到上，90度表示从左到右，180度表示从上到下。对于径向渐变，可以选择圆形或椭圆形，并调整渐变中心点位置。锥形渐变则可以设置起始角度。
第三步：添加和配置颜色停靠点。点击"添加颜色"按钮增加新的颜色停靠点。每个停靠点显示一个颜色选择器和位置输入框。点击颜色方块打开调色板，选择所需颜色。位置值用百分比表示，0% 是渐变起点，100% 是渐变终点。拖拽停靠点可以直观调整其位置。
第四步：调节透明度。展开某个停靠点的高级选项，可以看到透明度滑块。将滑块向左拖动降低不透明度，使该颜色变为半透明。透明渐变常用于创建重叠效果，例如在图片上叠加半透明渐变遮罩以增强文字可读性。
第五步：查看实时预览。参数面板右侧是预览区域，您的每一次调整都会即时反映在这里。预览区域默认显示矩形渐变效果，您可以点击"全屏预览"按钮查看大尺寸效果。还可以切换不同的背景色（白色、黑色、棋盘格）来检查透明区域的表现。
第六步：复制生成的代码。在参数面板下方的代码区域，工具自动生成了对应的 CSS 代码。代码包含标准的渐变函数和必要的浏览器前缀。点击"复制"按钮将代码复制到剪贴板，然后粘贴到您的样式表或内联样式中即可使用。
第七步：使用预设方案。如果您需要快速获得一个渐变效果，可以浏览预设库。预设按"暖色调"、"冷色调"、"彩虹色"、"单色渐变"等类别分组。点击任意预设即可应用到当前编辑中，之后再进行微调使其符合您的具体需求。
第八步：保存和管理方案。对满意的渐变效果，点击"收藏"按钮将其保存到本地收藏夹。工具会自动记录您的最近使用历史，方便快速找回之前编辑过的方案。收藏的方案可以通过导出功能保存为 JSON 文件，方便在不同设备间同步。
高级技巧：利用多个颜色停靠点创造复杂渐变。通过在渐变中添加多个颜色停靠点并精确控制它们的位置，可以创建出条纹、硬边过渡等特殊效果。将两个相邻停靠点放在相同的位置可以产生锐利的颜色边界，而不是平滑过渡。多加尝试和实验，您会发现 CSS 渐变的无限可能性。