交互式图像分割演示 - 点击分离对象
在图像上点击,利用前端模型将点击范围内的主要物体自动从背景分离。
GIF 动画转精灵表生成器 - 按行/列提取帧
上传 GIF 动画,提取每一帧并拼接为单张精灵表图片,可设置排列方式,用于游戏开发。
首屏大图构建器 - 标题/按钮/背景
设计带有大标题、描述、CTA 按钮和背景图的首屏区域,生成完整代码。
PWA启动画面生成 - 图标与背景色配置
配置启动画面背景色与图标,生成对应manifest和meta标签代码。
图标字体实时预览 - 输入码点测试大小
粘贴自定义图标字体的Unicode,调节尺寸颜色立即查看效果。
状态机可视化工具 - 绘制状态图并生成代码
拖拽添加状态和转换,定义事件和动作,生成 JavaScript 状态机代码。
渐变背景合集 - 现成UI Gradient一键复制
精选数百种流行渐变配色,点击即复制CSS代码,用于网页或应用背景。
剪影生成器 - 提取人物/物体轮廓变黑
上传正面照,简单亮度阈值提取剪影,可下载PNG。
简易全景图拼接器 - 两张图左右合成
将两到三张有重叠的手持照片拖入,手动寻找重叠区域自动混合为宽幅全景图。
图片背景预览器 - 不同UI背景效果模拟
上传图片并在白色、黑色、透明等背景上预览效果,辅助电商首图或UI元素设计。
DOM元素截图工具 - 指定区域导出图片
选中页面上的某个HTML元素,利用html2canvas将其渲染为PNG图片下载。
形状过渡分割线生成 - 页面区块曲线背景
生成用于网页各区块间的波浪或倾斜过渡分割线,导出为SVG或CSS代码。
基于模式的模拟数据生成器 - 自定义字段与规则
定义字段名称和类型(姓名、邮箱、数字范围等),批量生成符合规则的 JSON 模拟数据。
视频片段转GIF - 选取时间段导出动图
上传视频,截取其中一小段并转换GIF,可调帧率和尺寸,前端转换。
GIF分解精灵图导出 - 提取单帧和CSS定位
上传GIF并自动水平平铺提取各帧,生成对应的CSS精灵图定位代码。
在线图片裁剪工具 - Canvas自由裁剪/固定比例
前端图片裁剪工具,支持拖拽选取区域、固定比例(如1:1, 4:3)裁剪,实时预览并下载裁剪后图片。
朱利亚集分形探索 - 互动缩放彩色复数
交互式探索Julia集,实时调整复数参数c,支持平滑着色和鼠标缩放,感受分形之美。
视频动态缩略图生成器 - 提取片段生成 GIF
选择视频的一个片段,生成几秒钟的 GIF 动图作为预览缩略图,可设置尺寸和帧率。
粘贴事件处理演示 - 监听并解析剪贴板内容
捕捉页面粘贴事件,展示文本、HTML 或图片数据,演示如何定制粘贴行为。
精灵帧动画生成器 - 多图播放及CSS动画
上传序列帧图片,合成spritesheet并生成对应CSS steps()帧动画代码。
View Transition API 演练场 - 页面切换动画配置
在单页内模拟MPA过渡效果,自定义进场/出场动画,体验View Transitions API丝滑切换。
灵感拼贴板 - 图片随意拖放排版
上传图片随意摆放、缩放、旋转,创建个人愿景或情绪板。
曲线调整工具 - 类似PS的色阶曲线
通过拖拽贝塞尔曲线调整图片的亮度和颜色映射,实现高级调色效果。
简笔画识别小游戏 - 画图形AI猜
在Canvas画一个日常物品,内建简易识别尝试猜出画的是什么。
嵌入式Logo二维码设计器 - 自定义颜色与中心图
输入链接,上传Logo嵌入中心,选择颜色与模板,生成个性化高容错艺术码。
图片 3D 透视变换工具 - 拖拽角点进行三维映射
在图片上拖拽四个角点,实现任意四边形映射,模拟三维空间中的图片摆放效果。
指针锁定 API 演示 - 3D 迷宫移动
使用指针锁定 API 在 3D 场景中控制视角移动,模拟 FPS 游戏鼠标控制。
浏览器标签页预览模拟 - 切换主题
设置浏览器标题和图标,模拟在暗色/亮色主题下标签栏的样子。
L-system编辑器 - 自定义规则绘制分形
编写海龟绘图规则和初始公理,迭代生成龙曲线、植物等分形图形。
响应式设计测试工具 - 多分辨率视口预览
在线响应式布局测试器,同时预览常见设备分辨率的网页显示效果,帮助检查前端适配。
UD5工具箱