设计工具
为前端开发和视觉设计提供便捷工具,支持复制即用的 CSS,并根据 WCAG 对比度公式进行无障碍检查。
7 个工具
此分类中的工具
- 颜色转换器在 HEX、RGB、HSL、HWB、OKLCH 和简易 CMYK 之间转换颜色。粘贴 CSS 颜色值或使用取色器,然后复制所需格式。所有操作均在浏览器中完成。
- 对比度检查器检查文本和背景颜色的 WCAG 2.2 对比度,查看文本和 UI 元素的 AA、AAA 结果,并获取最接近的达标颜色。
- CSS 渐变生成器制作线性、径向和锥形 CSS 渐变,设置 2 到 6 个颜色色标、角度和位置,实时预览并复制 background CSS。
- Box Shadow 生成器设计多层 CSS box-shadow:调整偏移、模糊、扩展、颜色、透明度和内阴影。在任意背景上预览并复制 box-shadow CSS。
- 调色板生成器从一种颜色生成互补色、类似色、三角色、四角色、分裂互补色和明暗色阶。锁定颜色后,可复制 HEX、CSS 或 JSON。
- PX 转 REM 转换器在任意根字号下双向转换 px、rem 和 em(默认 16px)。提供常用尺寸对照表,还可批量转换完整 CSS 代码片段中的 px 值。
- 宽高比计算器计算任意宽高比对应的宽度或高度,将 1920×1080 等尺寸约分为 16:9,预览形状并复制 CSS aspect-ratio 规则。