UD5工具箱
SVG 动态波形背景生成器 - 多层叠加与动画
调节振幅、频率和颜色，生成多层SVG波浪，支持循环波动动画，导出CSS或SVG。
SVG形状过渡生成器 - 补间变形动画
SVG 形状过渡生成器
补间变形动画 · Morphing Tween起始形状
圆形
目标形状
方形
导出代码
选择预设形状后自动生成...
常见问题与知识点
什么是 SVG 形状补间（Morphing）？
SVG 形状补间是指两个不同形状之间平滑过渡的动画效果。通过在起始路径和目标路径的关键点之间进行插值计算，中间帧自动生成，实现形状的"变形"效果。这种技术在图标动画、logo 动效、UI 微交互中被广泛使用。
为什么两个形状需要相同数量的路径点？
SVG 的 SMIL 动画（<animate> 标签）要求起始和结束路径具有完全相同的命令结构和点数。本工具通过采样技术，将两个形状都转换为相同数量采样点的折线，从而确保它们可以互相过渡。采样点越多，过渡越平滑，但代码体积也越大。
如何导出动画并在我的项目中使用？
本工具支持三种导出格式：SMIL 动画（原生 SVG 动画，直接嵌入 SVG 文件）、CSS Keyframes（使用 CSS animation 驱动路径变化）、JavaScript（使用 requestAnimationFrame 实现，兼容性最好）。选择适合你项目的格式复制即可。
弹性缓动（elastic）和弹跳缓动（bounce）有什么区别？
弹性缓动在到达终点时会产生类似弹簧的振荡效果，带有衰减的来回摆动；弹跳缓动则模拟物体落地后逐渐衰减的弹跳，更加自然。这两种缓动适合为 UI 动效增添趣味性和物理真实感。
采样点数应该设置多少合适？
对于简单几何形状（如圆形、方形），50-100 个采样点就足够了。对于复杂形状或有精细曲线的路径，建议使用 150-300 个采样点。采样点越多过渡越平滑，但超过 300 个点后人眼几乎无法分辨差异，反而会增加代码体积。
SVG插画等比例缩放器 - 换色与导出
加载SVG插画，任意改变其整体或局部填充色，等比放大缩小后下载PNG。
网格渐变可视化编辑器 - 多点自由着色
在画布上放置多个色点，利用双线性插值生成平滑梦幻的多色渐变背景，可导出CSS或图片。
渐变噪点纹理生成器 - 有机质感CSS背景
组合多色渐变与SVG噪点叠加，生成独特且轻量的CSS背景纹理，适配现代UI。
韦恩图生成器 - 多圆交集可视化
自定义两到三个圆的标签和区域数值，绘制用于展示集合关系的韦恩图。
文本转Slug工具 - URL友好字符串生成器
将文章标题或任意文本转换为URL友好的slug（如my-article-title），支持多语言去除变音符号。
头像重叠堆栈生成器 - 群组图示CSS
生成多个头像重叠排列的视觉效果CSS，常用于表示群组成员。
CSS单位换算器 - px, em, rem, vw在线互转
输入数值和基数，在像素、em、rem、vw、vh等单位间进行转换，辅助响应式设计数值计算。
情感调色板生成器 - 词语映射颜色组
输入描述（如“海洋”、“日落”），从预定义词汇颜色库中生成和谐配色。
cURL 命令转 Fetch 代码 - 自动解析与生成
粘贴 cURL 命令，自动解析参数、头部和数据，生成对应的 Fetch API JavaScript 代码。
色调与色度生成器 - 明暗渐变色卡制作
选择基础色一键生成由浅至深（Tint到Shade）的色阶，调节步数和比例，输出完整色板。
波普半色调网点生成器 - CMYK网点艺术效果
将图片模拟为四色印刷的CMYK网点叠加效果，可调网点大小和角度。
cURL 命令转 Fetch 代码 - 在线自动转换
粘贴cURL命令，自动转换为原生JavaScript Fetch或Axios代码，含请求头与体，提升调试效率。
随机GIF生成器 - 拼凑独立帧成动图
上传一组图片或选择随机颜色块，调整间隔合成动态GIF，可反向或混合。
视频转GIF工具 - 选取片段与帧率
上传短视频，截取片段调整尺寸与帧率，转换为循环GIF动画，适合制作表情。
标签云生成器 - 输入词语频率生成CSS
输入词汇及其权重，生成可交互的HTML标签云。
像素填色画板 - 数字调色盘涂网格
网格内各数字对应颜色，按提示填充，完成像素艺术。
整数划分可视化 - 分堆块图演示
输入正整数，以图形化块图展示所有不同的整数划分方式。
图形均衡器可视化 - 可调频段增益的播放器
加载音频文件，提供10段频率增益滑块，实时音色调节并展示频谱图。
复平面绘制器 - 绘制复数和运算
在复平面上绘制复数点，并可直观展示加法、乘法等运算的几何意义。
感叹词库生成器 - 随机Wow! Ouch!等
点击随机获得一个英文感叹词及其使用场景说明。
泛音列可视化 - 拨弦波形与泛音成分
调整基频，以波形叠加的方式展示各泛音如何构成实际乐器音色。
渐变曲线采样器 - 沿贝塞尔曲线插值颜色
沿着一条三次贝塞尔曲线采样颜色，生成平滑的渐变色带代码，创意背景。
数组方法可视化 - map/filter/reduce
输入数组，应用map、filter、reduce等方法，逐步动画展示元素变化过程。
模拟散景效果 - 添加虚化光斑叠加
在照片上叠加多彩的圆形光斑，调整大小和数量，模拟大光圈镜头的散景。
在线数据库关系图生成器 - 视觉设计导出SQL
拖入表格与关联线设计数据库结构，自动输出建表DDL语句，支持MySQL/PostgreSQL方言。
分形树生成器 - L系统与递归深度交互
调节分叉角度、长度缩减比与递归深度，实时生成各种分形树并导出SVG，探索植物几何。
图片主色调提取器 - K均值聚类调色板
使用K-Means聚类算法从图片中提取3-8个主色调，生成配色方案，比单像素提取更准确。
打印样式生成器 - 网页打印优化@media print
生成用于网页打印的CSS样式，隐藏导航，调整字体、颜色和分页，让打印更整洁。
Cron定时任务生成器 - 通过点选构建表达式
可视化选择分钟、小时、日等，生成标准Cron表达式并预览下次执行时间。