图标与设计

Favicon 生成器

生成 ICO 与完整网站图标包

CSS 效果生成器

可视化生成阴影、渐变与圆角

颜色转换

HEX、RGB 与 HSL 实时互转

颜色对比度检查

检查文字与背景的 WCAG 可读性

SVG 优化器

清理压缩并预览 SVG 代码

SVG 转 PNG

自定义尺寸导出透明位图

配色方案生成器

主色生成明暗色阶变量

社交图片尺寸

查询封面与分享图规格

占位图片生成器

自定义尺寸、颜色和文字

SVG Sprite 生成器

合并多个 SVG 为 symbol 雪碧图

SVG 颜色替换

修改图标填充色和描边色

SVG 画布尺寸调整

修改 ViewBox、宽高和适配方式

SVG 转 CSS Data URI

压缩编码为 CSS 背景地址

色觉模拟器

预览常见色弱和灰度效果

CSS Color Mix 生成器

混合颜色并生成兼容色值

间距比例系统

生成统一间距 Token

字体比例系统

生成响应式字号层级

圆角 Token 生成器

统一组件圆角层级

Z-index 层级生成器

规划导航浮层和弹窗

阴影层级系统

生成卡片与弹窗阴影

品牌色阶生成器

从主色生成完整色阶

透明度 Token

生成常用透明度阶梯

栅格系统计算器

计算列宽、槽宽和边距

基线网格生成器

统一排版垂直节奏

配色对比矩阵

批量计算 WCAG 对比度

组件状态色生成器

生成 Hover 与 Active

动效时长 Token

统一动画时间节奏