UD5工具箱
全尺寸Favicon生成 - 多平台图标包
上传主图，同时生成32x32、180x180等平台所需的所有favicon尺寸和manifest。
多尺寸Favicon导出器 - 生成全平台图标包
🎯 多尺寸Favicon导出器
上传一张图片，自动生成覆盖所有主流平台的全套图标包：favicon.ico、Apple Touch Icon、Android Chrome、PWA Manifest 图标
拖拽图片到此处，或点击上传
支持 PNG / JPG / WebP / SVG / BMP
建议上传至少 512×512 像素的方形图片
上传图片后，生成的图标将在此处展示
❓ 常见问题 & 知识点
Favicon（Favorite Icon）是网站在浏览器标签页、书签栏、历史记录中显示的小图标。不同平台和设备需要不同尺寸：桌面浏览器常用16×16和32×32，iOS设备需要180×180的Apple Touch Icon，Android需要192×192和512×512用于PWA。提供完整尺寸包可确保在所有场景下都显示清晰的图标。
建议上传至少512×512像素的PNG图片（带透明背景更佳），以确保最大尺寸图标清晰。图片会自动裁剪为中心正方形。避免使用复杂细节的图片——favicon尺寸很小，简约设计效果最好。支持PNG、JPG、WebP、SVG、BMP格式。
favicon.ico是Windows传统的图标格式，支持在一个文件中嵌入多个尺寸（如16×16、32×32、48×48）。虽然现代浏览器也支持PNG格式的favicon，但使用.ico文件兼容性最好（尤其是旧版IE）。本工具生成的.ico包含3个尺寸，确保最大兼容性。
将所有生成的图标文件上传到网站根目录，然后复制本工具提供的HTML代码粘贴到网页的
<head>标签内。同时将site.webmanifest文件也上传到根目录。部署后可能需要清除浏览器缓存才能看到新图标。浏览器会积极缓存favicon。尝试以下方法：① 在图标URL后添加版本参数（如
?v=2）；② 清除浏览器缓存；③ 使用隐私/无痕模式查看；④ 在Chrome中访问chrome://favicon/你的域名查看缓存图标；⑤ 有时需要等待24-48小时浏览器才会刷新。site.webmanifest是PWA（渐进式Web应用）的配置文件，告诉浏览器如何将网站"安装"到设备主屏幕。虽然不是必须的，但使用manifest可以让你的网站在Android设备上以类原生应用的方式展示，提升用户体验。它需要配合192×192和512×512图标使用。
已复制到剪贴板
Flexbox属性速查 - 可视对照表
可视化Flexbox容器和子项的所有属性及选项，鼠标悬停预览效果。
范围滑块样式生成器 - 自定义input range外观
可视化配置范围滑块的轨道、滑块、填充颜色，生成跨浏览器的CSS代码。
Webpack 打包分析器 - stats.json 可视化
上传 webpack 的 stats.json，生成交互式树状图、模块大小排名，辅助优化构建体积。
混合风格精美时钟 - 拟物指针加数字日期
一款漂亮的拟物指针时钟，同时显示数字时间和日历，适合常驻副屏或全屏。
Web App Manifest 图标预览 - 模拟主屏图标效果
上传图标文件并设置背景色，模拟在 Android/iOS 主屏幕上的添加效果，检查视觉适配。
Lorem Ipsum占位文本生成器 - 在线随机假文
在线生成Lorem Ipsum占位文本，可指定段落数、单词数或字节数，用于设计排版和布局填充。
Flexbox 高级演练场 - 所有属性可视化控制
通过滑块和开关调整 Flex 容器和子项的所有 CSS 属性，实时观察布局变化，理解弹性盒子。
图片幻灯生成器 - 序列帧转视频WebM
上传一组图片，设定每张展示秒数和转场，生成WebM视频幻灯。
页面标题层级分析器 - h1~h6 结构检查
输入 HTML 或网址，提取所有标题标签，生成文档大纲树，检测跳跃和缺失。
CSS Grid 调试覆盖层 - 显示网格线与区域
在页面上叠加可拖拽的半透明网格线，辅助网格布局对齐。
gRPC-Web 一元调用测试器 - 发送请求并查看序列化
输入 gRPC 服务地址和方法，构造 JSON 请求体，观察转为二进制帧并接收响应解码。
3D多层阴影生成器 - 拟物化立体感
通过堆叠多层text-shadow或box-shadow创造浮雕或厚重立体文字效果，复制代码。
骨架屏代码生成器 - 加载占位灰色块
为内容区域生成灰色闪烁的骨架屏占位代码，包含卡片、标题等组件样式。
数学公式表生成器 - LaTeX 渲染打印版
从预置学科库选择公式，编辑并排列成A4公式表，支持LaTeX渲染输出，适合考前复习。
实时协作画板 - 通过WebSocket同步
基于简单WebSocket服务，多人同时在同一画布上绘图，远程协作。
渐变网格着色器 - 多点自由色渐变
在画布上放置多个色点，颜色平滑插值形成类似矢量网格渐变的梦幻背景。
屏幕标尺量角器 - 叠加元素测量长宽角度
可拖拽的虚拟尺子和量角器叠于当前页面，精确测量像素长度与旋转角度。
网站Favicon颜色提取 - 自动获取主色调
输入网址，尝试拉取该站favicon并提取其主要颜色，用于品牌配色参考。
Dialog 元素生成器 - 原生模态框样式定制
可视化配置<dialog>元素外观与行为，生成现代化、无障碍友好的模态框代码。
范围滑块预设集 - 复制各种风格range CSS
展示多种风格的<input type=range>样式，一键复制定制代码。
新拟态设计生成器 - CSS Neumorphism样式代码
调节光源角度、颜色和距离，生成凹凸柔和的新拟态UI元素CSS盒阴影代码，潮流设计工具。
无障碍多选下拉框生成器 - 复选框风格
创建带有复选框或标签的多选下拉列表，支持删除已选项，键盘可全控。
测试覆盖率可视化器 - 上传 lcov 文件查看行覆盖
拖放 lcov.info 文件，以颜色标示每行代码的覆盖状态。
JSON 结构树浏览器 - 交互展开与路径复制
粘贴JSON对象，生成可折叠的树形视图，点击节点复制其键值路径，方便调试。
SMART目标生成器 - 具体/可衡量等引导填写
逐步引导填写具体、可衡量、可达成、相关、时限的目标描述，生成完整目标句。
首屏大图模板生成器 - 文字叠加背景图
选择背景图片（或使用占位色），配置标题、副标题和按钮，生成Hero区域代码。
UUID/GUID在线生成器 - 全局唯一标识符
在线UUID生成器，一键生成符合RFC4122规范的UUID字符串（如v4随机），用于数据库主键或会话标识。
CSS 伪类效果测试场 - 实时查看 :is() :where() :has()
编写带有伪类的选择器，实时高亮匹配的HTML元素，探索现代CSS选择器的能力。
悬停提示框生成器 - 纯CSS/JS气泡样式定制
选择触发位置、箭头方向与样式，生成轻量悬停提示框代码。