设计与 CSS
生成实用的颜色和 CSS，并提供本地实时预览。
颜色转换器
转换 HEX、RGB 和 HSL 颜色并预览精确结果。
打开工具 →CSS 渐变生成器
构建双色线性渐变并复制可直接用于生产的 CSS。
打开工具 →WCAG 对比度检查器
计算两种颜色之间的对比度，并检查常见的 WCAG AA 和 AAA 文本阈值。
打开工具 →CSS 盒阴影生成器
使用实时颜色、偏移、模糊和扩散值组合一个 box-shadow。
打开工具 →CSS 文字阴影生成器
编写一个可读的 text-shadow 声明，并在所选背景上预览它。
打开工具 →CSS 圆角边框生成器
设置四个独立的角半径并导出生成的 CSS 声明。
打开工具 →响应式 CSS Clamp 生成器
在视口宽度之间计算最小和最大尺寸之间的流体 clamp 表达式。
打开工具 →PX ↔ REM 转换器
使用显式根字体大小转换像素和 rem 单位，以实现更易访问的布局。
打开工具 →CSS 三角形生成器
生成一个零尺寸的 CSS 边框三角形，支持四个方向，并可配置大小和颜色。
打开工具 →色调生成器
从一个 HEX 颜色创建确定性的由浅到深的色阶，并生成可复制的 CSS 变量。
打开工具 →CSS 加载器生成器
生成一个轻量级、无障碍的加载指示器，可配置大小、厚度、速度和颜色。
打开工具 →CSS 特异性计算器
计算选择器的特异性，并比较 ID、类、属性、伪类和元素选择器。
打开工具 →CSS 缓动函数生成器
验证 cubic-bezier 控制点并生成可重复使用的过渡时序 CSS。
打开工具 →CSS 自定义属性提取器
查找 CSS 变量声明、重复定义及其最新解析后的文本值。
打开工具 →CSS 媒体查询生成器
根据明确的响应式条件生成宽度、方向和运动偏好媒体查询。
打开工具 →CSS颜色值提取器
从粘贴的 CSS 中提取并统计 HEX、RGB、HSL 以及现代函数式颜色值。
打开工具 →CSS 支持规则构建器
从一个已验证的 CSS 声明生成正向和回退功能查询。
打开工具 →CSS 字体堆栈构建器
构建带引号的 font-family 字体族堆栈，明确通用后备字体并去除重复项。
打开工具 →CSS Z-Index 分析器
提取数字 z-index 声明，并在不执行样式表的情况下对堆叠值进行排序。
打开工具 →CSS 动画时长审计器
检查库存动画和过渡时长，并报告是否存在减少动态效果的处理。
打开工具 →CSS 断点清单
提取最小宽度和最大宽度媒体查询断点，并报告它们的频率和顺序。
打开工具 →CSS 逻辑属性检查器
比较物理 CSS 属性和相对流向的 CSS 属性用法，以实现适配 writing-mode 的布局。
打开工具 →CSS 字体大小清单
按值和单位提取 font-size 声明，以揭示不一致的排版尺度。
打开工具 →CSS 网格轨道分析器
使用 repeat 和 minmax 的库存 grid-template 行和列声明摘要。
打开工具 →本页面没有匹配的工具。