状态机可视化工具 - 绘制状态图并生成代码
拖拽添加状态和转换,定义事件和动作,生成 JavaScript 状态机代码。
可变字体调节器 - 拖拽轴权预览
加载可变字体,通过滑块调整字重、字宽、倾斜等注册轴,并导出设置代码。
链接下划线样式生成器 - 悬停动画
配置不同的下划线出现、消失动画(从中间、左侧等),生成链接美化CSS。
CSS 关键帧时间轴编辑器 - 拖拽属性关键点
在时间轴上拖拽添加属性关键帧,实时预览动画并生成 @keyframes 代码。
轮播图代码生成器 - 滑动幻灯片HTML/JS
拖拽添加图片与文字,生成响应式轮播图Slider,支持自动播放和导航点,提供HTML/CSS/JS代码。
化学方程式配平游戏 - 拖拽系数使平衡
提供未平衡的反应式,拖拽滑块调整各物质系数直到原子守恒。
交互式线性回归 - 拖拽数据点修拟合线
在散点图上拖拽数据点,实时更新最小二乘回归线,显示斜率和截距。
紧急重要排序练习 - 拖入象限并设时限
待办项拖入四象限,并设置每个的提醒时间,自动排序今日。
GIF 动画转精灵表生成器 - 按行/列提取帧
上传 GIF 动画,提取每一帧并拼接为单张精灵表图片,可设置排列方式,用于游戏开发。
颜文字表情拼装器 - 拖拽部件生成Kaomoji
从眉毛、眼睛、嘴巴等部件中拖拽组合,生成独一无二的日式颜文字表情,一键复制。
浮动图片拼贴画 - 拖拽随意摆放多图
上传多张图片,在画布上自由拖拽位置、旋转和调整大小,创造自由拼贴。
单线一笔画艺术 - 将图片变成连续曲线
用一根连续不断的回旋曲线填充并重绘图片的原理,创造独特单线艺术。
灵感拼贴板 - 图片随意拖放排版
上传图片随意摆放、缩放、旋转,创建个人愿景或情绪板。
全景声方位模拟 - 拖拽声源全向移动
使用Web Audio PannerNode,在头顶环绕拖拽一个声源,体验声音在空间的移动。
View Transition API 演练场 - 页面切换动画配置
在单页内模拟MPA过渡效果,自定义进场/出场动画,体验View Transitions API丝滑切换。
鼠标轨迹记录回放 - 画布上重绘
在Canvas上移动鼠标绘制线条,并记录轨迹,支持回放绘画过程。
EXIF自动旋转 - 根据方向标签摆正照片
读取照片EXIF Orientation并自动旋转图片到正确方向,导出修正后的JPEG。
文字编织花样预览器 - 上/下针符号转图案
输入文字描述或符号(如K, P),生成编织花样预览图,方便织女试读图解。
波形音频播放器组件 - 可拖拽进度高亮
生成带有音频波形可视化、可点击跳转的可定制HTML音频播放器代码。
绳结拓扑展示 - 三叶结等绘制旋转
展示常见纽结(三叶结、八字结等)的三维弯曲造型,用户可旋转观察交叉。
CSS动画录制器 - 拖拽元素生成关键帧代码
在时间轴上拖拽一个元素的位置和样式,自动录制并生成对应的CSS @keyframes动画代码。
View Transition 模拟页面切换 - 使用 startViewTransition
在两个视图间切换并调用 document.startViewTransition,观察浏览器默认过渡动画。
拖拽排序器 - 手动调整列表顺序
输入列表项,通过鼠标拖拽手动排列项目顺序后导出。
表单代码生成器 - 拖拽式HTML表单构建
拖拽文本框、下拉框、单选复选等元素,排列组成表单,导出整洁的HTML表单结构代码。
抽象圆点艺术生成 - 随机多彩圆形排列
生成由不同大小、颜色和透明度的圆组成的抽象画作,可下载为壁纸。
滑动下划线动画生成器 - 菜单悬停特效CSS
配置下划线从中间或一侧滑出的动画,生成无限菜单效果代码。
简易时间追踪周表 - 拖拽分配时长
在周视图上拖拽时间段,直观记录每天各项活动的耗时,汇总统计。
房间布局规划器 - 家具摆放拖拽
设定房间尺寸,拖拽各种家具图标布置房间,辅助搬家或重新装修。
剪贴板转条形码 - 粘贴编号快速生成
粘贴剪贴板中的数字,立刻生成对应的一维条形码图片。
类似色生成器 - 色轮邻近色彩方案
选择一个基色,自动计算色环上左右各30度的类似色,适合温和配色。
UD5工具箱