UD5工具箱
响应式字体计算器 - 最小/最大视口字号平滑缩放
设定最小与最大字体规格及视口范围，自动生成CSS clamp() 函数，实现流式排版。
标签： 响应式工具 - 视口与媒体查询测试
共 17+ 款工具像素单位换算器 - PX/EM/REM/VW 在线互转
输入像素值并设定根字号或视口宽度，一键换算为 rem/em/vw 等相对单位，方便响应式开发。
视口尺寸快速切换书签小工具 - 一键调整浏览器大小
生成一个 Bookmarklet，点击即弹出面板选择预定义设备尺寸，调整当前窗口大小。
侧边抽屉菜单生成 - 响应式Drawer组件
生成一个从左侧或右侧滑出、带有透明遮罩层的移动端菜单组件。
CSS 容器查询实验室 - 基于卡片宽度的响应式布局
拖拽改变容器宽度，观察使用container-type和@container规则的元素如何自适应样式。
响应式邮件模板组装 - 拖拽模块搭建
通过拖拽预置的标题、图片、按钮等模块，生成兼容多数客户端的邮件HTML。
多设备同步预览框架 - iframe并排
输入URL，在同一个页面上并排显示手机/平板/桌面三种尺寸的实时预览。
响应式断点调试器 - 顶部标尺显示
在页面顶部显示一个悬浮标尺，实时显示当前视口宽度及常用断点线（768px等）。
响应式网格框架选择器 - 比较Bootstrap/Tailwind等
选择不同CSS框架的网格系统配置，对比生成的列数和类名差异，辅助技术选型。
响应式测试互动盒 - 输入代码观看不同尺寸
粘贴HTML/CSS片段，拖动视口调整宽度，实时观察布局变化。
响应式断点分析器 - CSS媒体查询可视化
扫描指定CSS中的所有媒体查询，生成带断点标记的视口标尺和交互式覆盖图。
容器查询互动沙盒 - @container响应式组件
在卡片内调整容器尺寸，直观预览基于容器宽度的样式变化，学习和验证CSS容器查询。
响应式图片srcset生成 - 断点描述符
输入多尺寸图片URL，生成带srcset和sizes的响应式img标签，适配各种屏幕。
CSS媒体查询生成器 - 响应式断点代码生成
可视化选择设备类型、屏幕方向和宽度范围，一键生成标准CSS媒体查询代码。
响应式邮件测试发送器 - 发送测试邮件到指定邮箱
编写或粘贴 HTML 邮件代码，通过免费邮件发送 API 发送一份测试邮件给自己检查效果。
响应式设计测试工具 - 多分辨率视口预览
在线响应式布局测试器，同时预览常见设备分辨率的网页显示效果，帮助检查前端适配。
CSS Clamp() 生成器 - 最小/首选/最大字体
设定最小、首选、最大三个尺寸及视口范围，生成响应式CSS clamp()表达式。