UD5工具箱
素数搜索动画 - 试除法与埃拉托斯特尼筛法动态比较
并行动画展示试除法和埃拉托斯特尼筛法查找素数的过程，对比效率。
标签： 动画工具 - CSS 动效生成
共 85+ 款工具勾股定理证明动画 - 面积拼图法演示
通过正方形面积拼图动画直观证明 a²+b²=c²，支持多种经典证明方法切换。
埃拉托斯特尼筛法动画 - 素数的筛选过程
逐步动画展示埃拉托斯特尼筛法，高亮被划掉的合数，直观理解素数生成原理。
RISC-V 流水线动画 - 五级经典流水线展示
动画展示 RISC-V 五级流水线（取指、译码、执行、访存、写回）的执行过程及冒险。
Kruskal 最小生成树动画 - 按边排序并查集
动画展示 Kruskal 算法选择边和合并集合的过程，高亮生成树边。
数字滚动增长动画生成器 - 从0到目标数
输入目标数字，生成数字从 0 渐增到该值的滚动动画代码，可调节速度和缓动。
CSS 运动路径构建器 - offset-path 动画设计
绘制 SVG 路径，将动画元素绑定到路径上，生成 offset-path 动画代码。
动画帧率分析器 - requestAnimationFrame 监控
显示当前页面动画的实时 FPS 图表，检测掉帧和卡顿，辅助性能优化。
加载动画合集 - 纯 CSS 旋转器/骨架屏
展示数十种纯 CSS 的加载动画和骨架屏效果，点击复制代码直接使用。
GIF 动画转精灵表生成器 - 按行/列提取帧
上传 GIF 动画，提取每一帧并拼接为单张精灵表图片，可设置排列方式，用于游戏开发。
页面过渡效果沙盒 - 模拟 SPA 页面切换动画
选择和自定义页面进入/离开的动画效果（淡入、滑动、缩放），模拟多页面间的过渡。
二叉树遍历动画 - 前/中/后/层序可视化
构建或随机生成二叉树，逐步动画展示前序、中序、后序和层序遍历的路径。
Animation Worklet 演示 - 基于工作线程的高性能动画
创建并运行动画工作线程，展示不受主线程影响的平滑动画效果。
CSS 滚动时间线生成器 - 可视化创建 scroll-timeline 动画
拖拽设置滚动时间线的触发范围与动画关键帧，自动生成 @scroll-timeline 及 animation-timeline CSS 代码。
SVG 动画合成器 - 拖拽元素创建 SMIL 动画
在 SVG 画布上添加形状，设定动画属性（位置、颜色等），生成可内嵌的动画 SVG。
精灵表查看器 - 分解并预览各帧动画
上传精灵表图片，设定行数和列数，实时播放动画并提取单帧。
CSS 关键帧时间轴编辑器 - 拖拽属性关键点
在时间轴上拖拽添加属性关键帧，实时预览动画并生成 @keyframes 代码。
@property 规则演示 - 自定义属性类型与动画
注册带类型的 CSS 自定义属性，观察其如何支持过渡动画和继承效果。
View Transition 模拟页面切换 - 使用 startViewTransition
在两个视图间切换并调用 document.startViewTransition，观察浏览器默认过渡动画。
CSS motion-path 路径动画演示 - 元素沿路径运动
绘制 SVG 路径，让元素沿着路径运动，调整速度和缓动，生成动画代码。
动态 GIF 合成工具 - 多张图片帧合并成 GIF
上传多张图片作为帧，调整每帧延迟，合成并下载动态 GIF，完全浏览器端实现。
Lottie 动画在线预览器 - 加载 JSON 动画文件播放
拖入 Lottie 动画 JSON 文件，即刻播放矢量动画，支持暂停、调速、背景颜色设置。
WebP 动画帧分解工具 - 提取每帧为静态图片
上传动态 WebP 文件，分离每一帧并下载为独立的 PNG 或 WebP 图片。
CSS 缓动函数可视化预览 - 动画 timing-function 演示
展示所有内置缓动函数（ease, linear 等）及自定义 cubic-bezier 的运动曲线和动画效果。
CSS Transform 在线生成器 - 平移/旋转/缩放/倾斜 可视化
拖拽或输入数值组合多个 CSS transform 函数，实时观察元素变换效果并获取代码。
面部瑜伽练习引导 - 紧致提拉动画教学
跟着动画演示做面部肌肉锻炼，每天几分钟，舒缓表情纹。
CSS动画录制回放器 - 捕获并微调关键帧
手动播放一个动画，录制元素实际位置变化，反向生成@keyframes。
绳结打法动画 - 10种户外常用结详解
分步动画演示称人结、双套结等打法，可慢放跟学。
正念呼吸球动画 - 跟随膨胀收缩呼吸引导
屏幕上循环展示膨胀收缩的球体，用户跟随节奏吸气呼气，缓解压力。
像素绘板 - 网格填色与动画帧
在可缩放网格上选区颜色绘制像素图，支持多帧预览简单动画。
洗手计时器 - 20秒动画配上生日快乐歌节奏
启动后显示20秒动画倒计时与搓手示范，配“生日快乐”节奏提示。
光合作用过程动画 - 光反应与暗反应步骤
逐步播放叶绿体中进行的光合作用，标注参与物质与能量变化。
打地鼠动画版 - 随机出现点击得分
地鼠随机从洞中弹出，玩家点击击打得分，速度渐增。
SVG 动态波形背景生成器 - 多层叠加与动画
调节振幅、频率和颜色，生成多层SVG波浪，支持循环波动动画，导出CSS或SVG。
CSS 动画曲线编辑器 - 贝塞尔可视化重定义
拖动曲线手柄调整动画缓动，实时预览弹跳或淡入效果，生成cubic-bezier值。
视频转GIF工具 - 选取片段与帧率
上传短视频，截取片段调整尺寸与帧率，转换为循环GIF动画，适合制作表情。
View Transition API 演练场 - 页面切换动画配置
在单页内模拟MPA过渡效果，自定义进场/出场动画，体验View Transitions API丝滑切换。
滚动驱动动画创作台 - 基于Scroll Timeline的可视化
配置滚动容器与目标元素，自定义随滚动触发的关键帧动画，输出纯CSS代码。
Canvas 烟花绽放动效 - 鼠标点击发射烟花
在网页画布上点击鼠标发射绚丽的粒子烟花，支持重力、拖尾和随机颜色，适合节日气氛。
旗语动画演示器 - 字母/数字旗语翻译
输入文本，以动画小人挥舞旗帜演示国际旗语及莫尔斯旗语样式。
环形缓冲区动画演示 - 读写指针运动
动画展示环形/循环缓冲区的Enqueue、Dequeue操作以及头尾指针的移动逻辑。
虚拟镇静瓶 - 摇晃后闪片缓缓落下
摇晃屏幕（或点击）让亮片乱舞，然后静静观看它们缓慢沉降，用于情绪平静。
动态通知徽章生成器 - 数字抖动/红点特效
创建带有弹性动画的通知数字徽章或红点，生成对应的HTML/CSS代码。
SVG路径补间变形动画生成器
在两个不同形状的SVG路径间自动生成流畅的过渡变形动画SMIL代码。
互动指针特效生成器 - 鼠标光标跟随动画
选择光晕、拖尾、磁吸等风格，生成自制的JS鼠标光标特效代码。
动态SVG表情编辑器 - 眨眼/微笑动画
调节笑脸的眼睛和嘴巴弯曲度，添加眨眼等简单动画，导出动态SVG或GIF。
岩石圈循环动画 - 火成/沉积/变质
动画展示火成岩、沉积岩和变质岩之间如何通过埋藏、风化等过程相互转化。
交互式水循环演示 - 蒸发/降水/径流
拖拽太阳、云朵因素，直观展示自然界水循环的蒸发、凝结、降落和渗透过程。
CSS动画时间轴编辑器 - 可视化关键帧
拖拽轨道上的关键帧，调整动画属性和时间点，直接生成@keyframes代码。
打字机占位符效果 - 输入框动画
生成在输入框内不断打字删除的动态占位符示例文字，提供HTML/CSS代码。
Dijkstra最短路径动画 - 图论寻路展示
点击节点添加路径权重，运行Dijkstra算法高亮从起点到所有节点的最短距离和路径。
最小生成树演示 - Prim/Kruskal算法
在画布上放置节点和边，动画展示普里姆和克鲁斯卡尔算法构造最小生成树的过程。
汉诺塔问题动画 - 递归求解过程演示
输入盘子数量，动画展示汉诺塔的递归移动步骤，帮助理解递归思想。
梯度下降可视化 - 寻找函数最小值动画
在二维函数曲面上动态展示梯度下降算法的迭代过程，可调节学习率和初始点。
CSS自定义属性注册演示 - @property
通过注册CSS属性的类型和初始值，演示如何让渐变等属性实现平滑动画。
基数排序动画 - LSD方法逐步可视化
随机生成整数数组，逐步展示按低位优先进行的基数排序过程，辅助算法理解。
滚动驱动动画沙盒 - Animation Timeline演示
绑定动画进度到滚动位置，交互式调整参数，直观理解scroll-timeline和view-timeline。
视图过渡动画演示 - View Transitions API
在多页面或元素切换时呈现流畅的交叉淡入淡出和变形动画，体验原生视图过渡。
预设动画库 - 常用CSS关键帧
浏览并一键复制常见CSS动画（跳动、淡入、滑动等）的@keyframes代码。
彩虹渐变边框生成器 - 动态旋转边框
生成围绕元素不停旋转的多彩渐变边框，通过conic-gradient实现。