用途:对单个 Figma 组件或组件集做深度无障碍审计,返回 0–100 加权评分卡和按优先级排序的修复建议。与 figma-lint-design 的整树规则扫描不同,本技能聚焦单个组件,能识别变体轴,自动区分交互型与展示型组件并据此调整评分维度与权重。
主要能力:检查真实变体树、填充、描边、效果和组件描述;覆盖默认/悬停/聚焦/禁用/错误/激活/加载等状态;对比度基于 sRGB 亮度计算,色盲模拟使用 Brettel/Viénot 二色觉矩阵;点击目标最小尺寸可配置,TARGET_SIZE 默认 24(WCAG 2.5.8 最低要求),移动端可传 44 或 48。overallScore 为六类得分的分类加权混合,各类别权重与提升方法见 references/audit-categories.md。
使用方式:先加载官方 figma-use 技能(完整 Figma Plugin API 参考)。脚本要求:纯 JS,顶层 await + return,不用 IIFE,不调用 figma.closePlugin(),console.log 不会返回;输入以 const 内联在脚本顶部;颜色为 0–1 范围;任何文本操作前先加载字体;使用 await figma.getNodeByIdAsync(...);脚本出错为原子性,失败不产生任何改动。将 NODE_ID 设为 COMPONENT_SET、COMPONENT 或 INSTANCE 的 id(脚本会自动从 INSTANCE 走到主组件再到父组件集),留空则审计当前单选对象。然后通过 use_figma 运行 scripts/audit-accessibility.js(skillNames: "figma-audit-accessibility"),读取评分卡,按 recommendations[] 中已按 high/medium/low 排序并标注 WCAG SC 的建议修复,再重跑确认分数变化。
适用场景:需要针对单个组件做深入无障碍评估、验证交互状态覆盖或对比度合规时使用。
限制:审计为只读,修复需用 figma-manage-variables / figma-use 应用后再重新审计;整树 WCAG 与设计系统检查应改用 figma-lint-design;代码侧 axe-core 检查用 figma-scan-code-accessibility;设计稿与代码差异用 figma-check-design-parity。