审查 CSS 片段
格式化 CSS 片段，复制 CSS 审查报告，再检查压缩和颜色对比。
- 1. CSS
格式化片段并复制包含 selector、token、cascade、specificity 和清单信号的报告。
- 2. CSS Min
若要共享压缩 CSS，请检查压缩率、注释移除和 minify 审查报告。
- 3. Color
当片段改变前景或背景颜色时，用 WCAG 对比标准检查 color token。
CSS代码隐私: 浏览器本地
CSS 格式化器
整理压缩的 CSS 规则，让选择器、属性和媒体查询更容易检查。
输入 / 输出
先使用工具
输入、输出和复制操作集中在这个主区域。示例和检查内容放在下方。
本地会话
输入状态只保存在此浏览器中，可在无账号时恢复上次工作区。
得到结果后再检查
完成主要输入/输出流程后，再打开需要的示例、检查清单和相关工具。
3 工具
检查颜色无障碍
转换前景/背景颜色，复制 WCAG 对比报告，然后在发布前检查 CSS token 和视觉资产。
- 1. Color
转换 HEX/RGB/HSL 配色，检查 AA/AAA 阈值，然后复制无障碍报告。
- 2. CSS
提交前检查 CSS token 名称、selector 和重复颜色值。
- 3. Favicon
确认品牌首字母或小图标在所选背景上仍清晰可读。
复制前检查
- 再次比较原始输入和输出形态。
- 确认目标运行时、编码、时区和安全策略差异。
- 继续用相关工具检查 CSS 格式化器 的结果是否适合下一步。
常见失败情况
- 整理压缩的 CSS 规则，让选择器、属性和媒体查询更容易检查。
- 如果浏览器本地处理方式和真实输入结构不一致, 输出不能直接信任。
相关工具
指南
得到结果后再检查
完成主要输入/输出流程后，再打开需要的示例、检查清单和相关工具。
示例
此工具的起始示例.card{display:flex;color:#111}@media (min-width:768px){.grid{grid-template-columns:repeat(3,1fr)}}:root{--gap:16px}.panel{padding:var(--gap);border:1px solid #ddd}使用场景
代码- 整理压缩的 CSS 规则，让选择器、属性和媒体查询更容易检查。
- 以浏览器本地方式处理输入，并在复制前检查结果。
- 结合 CSS 格式化器 和相关工具缩短工作流。
- 再次比较原始输入和输出形态。
- 确认目标运行时、编码、时区和安全策略差异。
- 继续用相关工具检查 CSS 格式化器 的结果是否适合下一步。