UD5工具箱
角标Favicon生成器 - 带红点或数字的图标
上传图标并添加未读数的角标红点或数字，生成带提醒效果的网站Favicon。
带角标Favicon生成 - 数字小红点提醒
拖拽图片到此处 或 点击上传
支持 PNG / JPG / SVG / GIF / ICO
留空=纯红点
超过 99 自动显示 "99+"，留空显示无数字小红点
角标半径占图标边长的百分比
实时预览
256×256 画布棋盘格背景表示透明区域，下载的PNG保留透明通道
常见问题与知识点
角标 Favicon 是在网站图标（Favicon）的右上角叠加一个数字红点提醒的设计元素。它常用于：
• PWA 应用图标：显示未读消息数、待处理任务数
• 浏览器标签页：让用户在不切换标签时也能注意到新动态
• 书签图标：在收藏夹中突出显示需要关注的站点
• 通知类Web应用：邮件、社交、任务管理等场景
• PWA 应用图标：显示未读消息数、待处理任务数
• 浏览器标签页：让用户在不切换标签时也能注意到新动态
• 书签图标：在收藏夹中突出显示需要关注的站点
• 通知类Web应用：邮件、社交、任务管理等场景
现代网站推荐使用多尺寸策略：
• 16×16：浏览器标签页、收藏夹默认尺寸
• 32×32：大多数浏览器标签页的高DPI显示
• 48×48 / 64×64：桌面快捷方式、Windows磁贴
• 128×128 / 256×256：PWA manifest图标、macOS Touch Bar
HTML中可同时声明多个尺寸：
• 16×16：浏览器标签页、收藏夹默认尺寸
• 32×32：大多数浏览器标签页的高DPI显示
• 48×48 / 64×64：桌面快捷方式、Windows磁贴
• 128×128 / 256×256：PWA manifest图标、macOS Touch Bar
HTML中可同时声明多个尺寸：
<link rel="icon" sizes="32x32" href="...">
PNG 格式在现代Web开发中已经完全替代了传统的ICO格式：
• 所有现代浏览器（Chrome、Firefox、Safari、Edge）均支持PNG作为favicon
• PNG支持完整的透明通道（Alpha），而ICO的透明支持有限
• PNG文件更小，加载更快
• 如需ICO格式，可下载PNG后使用在线转换工具（如convertio.co）转换
• 所有现代浏览器（Chrome、Firefox、Safari、Edge）均支持PNG作为favicon
• PNG支持完整的透明通道（Alpha），而ICO的透明支持有限
• PNG文件更小，加载更快
• 如需ICO格式，可下载PNG后使用在线转换工具（如convertio.co）转换
在16×16的极小尺寸下，数字细节会变得模糊，这是物理像素限制导致的。此时角标会呈现为一个隐约的小红点，仍能起到视觉提醒作用。如需清晰显示数字，建议使用32×32或更大的尺寸。PWA应用推荐使用192×192或256×256的图标。
Emoji图标功能适合快速原型设计。需要注意：
• Emoji在不同操作系统（macOS / Windows / iOS / Android）上渲染效果不同
• macOS的Apple Color Emoji渲染最为精美
• Canvas绘制Emoji在某些旧浏览器上可能显示为黑白
• 推荐使用通用性高的Emoji（如🔔💬📧⭐），避免过于新的Emoji
• 正式生产环境建议使用专业设计的图标图片
• Emoji在不同操作系统（macOS / Windows / iOS / Android）上渲染效果不同
• macOS的Apple Color Emoji渲染最为精美
• Canvas绘制Emoji在某些旧浏览器上可能显示为黑白
• 推荐使用通用性高的Emoji（如🔔💬📧⭐），避免过于新的Emoji
• 正式生产环境建议使用专业设计的图标图片
动态通知徽章生成器 - 数字抖动/红点特效
创建带有弹性动画的通知数字徽章或红点，生成对应的HTML/CSS代码。
网站图标一键提取 - 从任何URL获取Favicon
输入网站域名，自动探测并提取其Favicon，可下载。
Favicon在线生成器 - 文字/Emoji转网站图标
通过Canvas将文字、字母或Emoji渲染为多尺寸favicon.ico，快速为您的网站生成小图标。
ConfigMap 生成器 - 从键值对快速生成 Kubernetes 资源
输入键值对，自动生成 Kubernetes ConfigMap YAML，支持文字和多行数据。
Badging API 徽章模拟器 - 设置App图标数字角标
在PWA环境中设置和清除应用图标上的数字角标，演示Badging API的简单用法。
JSON Schema 假数据生成器 - 按定义创建莫克数据
定义JSON Schema结构，自动填充符合类型与格式的随机数据，支持导出大文件用于压力测试。
简单验证码生成器 - Canvas随机字符图片
生成简单数字或字母验证码图片，带干扰线和噪点，适合前端原型测试，不依赖服务端。
PWA应用图标和徽章生成 - 自适应圆形
上传主图标，自动生成带安全区域内缩的maskable-icon和monochrome通知徽章。
焦点指示器样式定制器 - 生成 :focus-visible 样式
实时调整焦点轮廓的颜色、粗细和偏移，生成美观且高对比度的焦点样式代码。
浏览器扩展图标生成 - 多尺寸一键输出
上传一个主图标，同时生成16x16至128x128的所有标准浏览器扩展图标尺寸。
全平台 Favicon 生成器 - 适配 iOS/Android/Windows
上传图标，一键生成适用于各种设备和浏览器的 favicon 及 manifest 图标集，包含 HTML 代码。
奇幻角色名生成器 - 精灵/矮人/兽人名
选择种族与性别，生成符合奇幻设定的角色全名，附带简短性格特征，适合TRPG与写作。
随机用户信息生成器 - Mock数据在线生成
生成随机的姓名、邮箱、地址、电话等用户信息，支持自定义字段和批量输出JSON数组，用于测试填充。
编织圈数计数器 - 拍照或手动标记
一个大按钮，每勾完一圈点击计数，并显示当前圈数，防止遗忘。
数回 Slitherlink 在线玩 - 点阵环线逻辑游戏
根据数字提示连接点阵画出一个闭环曲线，经典日本谜题，锻炼逻辑推理。
时区徽章生成 - 个人/团队工作时间表
选择所在时区和典型工作时间，生成显示可用时段的徽章图片。
环形缓冲区动画演示 - 读写指针运动
动画展示环形/循环缓冲区的Enqueue、Dequeue操作以及头尾指针的移动逻辑。
植物细胞结构标注器 - 点击部件高亮
完整的植物细胞图，点击或悬停任一部分（如叶绿体），显示其名称和功能说明。
CSV转地图标记 - 经纬度列表点在地图
上传含经纬度的CSV，在静态地图或Leaflet上标出所有点。
西蒙记忆色块游戏 - 颜色序列复述
经典西蒙游戏，四种颜色随机闪烁，玩家复述序列，长度递增。
CSRF 令牌生成与验证模拟器 - 跨站请求伪造防护
同步器令牌模式演示：生成令牌嵌入表单，提交时验证，理解CSRF防护核心流程。
西蒙记忆游戏 - 在线颜色序列重复挑战
经典的Simon Says记忆游戏，观察颜色亮起顺序并重复点击，序列逐渐加长，考验脑力。
棒针图解阅读器 - 符号高亮当前行
加载棒针文字图解，高亮正在编织的当前行，手动推进，辅助跟解。
PEM证书详细解码器 - 在线查看X.509字段
粘贴Base64编码的PEM证书，解码并显示颁发者、有效期、公钥算法与指纹等信息。
WebAuthn模拟器 - 创建与验证凭据
使用CTAP2模拟器或安全密钥在浏览器中体验无密码注册与认证流程。
NanoID在线生成器 - 紧凑唯一ID生成
生成更短、更安全的NanoID随机字符串，可自定义长度和字符集，替代UUID的轻量方案。
Base58编码解码工具 - 无模糊字符的编码格式
在线Base58编码与解码，剔除易混淆字符（0、O、l、I），常用于比特币地址和短链接。
图片文字识别轻量版 - Tesseract.js
上传图片，利用Tesseract.js离线识别其中的英文或简单文字并复制。
钩针图解生成器 - 符号转简单图案
选择针法符号，在圆形或方形模板上排布，生成钩针编织的花样示意图。