设计工具
这些工具适合用来处理颜色、渐变、布局、阴影、间距等视觉细节工作。
9 个工具可用免费浏览器工具以搜索为先的工具目录
适合渐变、配色、圆角、阴影和布局等设计与 CSS 实用场景的可视化工具。
CP
配色生成器
从单个基础色生成协调的明暗配色。
打开工具GR
CSS 渐变生成器
生成线性或径向渐变并实时预览。
打开工具CL
颜色转换器
在 HEX、RGB 和 HSL 之间同步转换。
打开工具SV
SVG 编辑
粘贴 SVG 代码后实时预览,压缩冗余标记并输出。
打开工具ED
取色器
基于 EyeDropper API 从屏幕取色,快速获取 HEX 颜色值。
打开工具BS
Box Shadow
调整阴影偏移、模糊、扩散和颜色,生成 CSS 代码。
打开工具BR
Border Radius
可视化调整四角或不规则圆角,实时预览 CSS 。
打开工具LG
布局生成器
可视化配置 Flexbox 或 Grid 属性,并复制对应 CSS。
打开工具PX
单位换算
根据 root font size 在 px、rem 和 em 之间相互换算。
打开工具