Agent Skills
› jakubkrehel/skills
jakubkrehel/skills
GitHub审查并修复项目的键盘导航、焦点行为、ARIA语义、表单及屏幕阅读器支持，确保符合WCAG 2.2标准。强调原生元素优先和可见焦点环。
Install All Skills
npx skills add jakubkrehel/skills --all -g -y
Skills in Collection (14)
审查并修复项目的键盘导航、焦点行为、ARIA语义、表单及屏幕阅读器支持，确保符合WCAG 2.2标准。强调原生元素优先和可见焦点环。
需要检查或提升Web应用无障碍访问性
修复违反WCAG标准的键盘交互或屏幕阅读器问题
npx skills add jakubkrehel/skills --skill better-accessibility -g -y
协助构建和审计项目颜色系统，生成色阶、命名语义Token、转换格式及测量对比度。
构建新的颜色系统
审计现有颜色规范
生成色阶与Token映射
npx skills add jakubkrehel/skills --skill better-colors -g -y
跨学科界面审查编排技能，路由至无障碍、布局、文案等专项技能收集证据并生成统一评审结论。
需要综合评估界面可用性、视觉及交互质量
请求对特定屏幕或功能流进行多维度UX/UI审查
npx skills add jakubkrehel/skills --skill better-interface -g -y
指导 UI 布局的结构化与响应式设计，涵盖分组、对齐、阅读顺序及 RTL 适配。通过间距和逻辑属性确保界面在缩放、翻译或镜像时保持可用性和视觉一致性。
需要优化界面布局结构
处理多语言或 RTL 适配问题
调整组件间距与对齐方式
npx skills add jakubkrehel/skills --skill better-layout -g -y
规范前端文本渲染，涵盖字体缩放、行高、字重及加载策略。通过CSS属性而非原始标签优化排版，确保视觉层级与一致性，并关联其他技能处理语义、可访问性及布局问题。
前端UI样式审查
CSS排版规则制定
字体加载与渲染优化
npx skills add jakubkrehel/skills --skill better-typography -g -y
提供UI视觉打磨的精确规范，涵盖圆角、光学对齐、阴影及动画状态等细节。用于在交互逻辑完善后提升界面精致度，确保视觉一致性。
需要调整界面视觉细节
检查UI组件的圆角、阴影或对齐问题
优化动画和过渡效果
npx skills add jakubkrehel/skills --skill better-ui -g -y
负责撰写和审查界面文案（如标签、错误提示），确保符合产品语调并指导用户操作。涵盖术语统一、语气调整及直接面向读者的写作规范，提升用户体验与一致性。
需要生成或优化界面文案时
审查现有UI文本的清晰度与语调一致性时
npx skills add jakubkrehel/skills --skill better-writing -g -y
对指定组件进行压力测试，生成包含各种极端场景的隔离页面以暴露视觉缺陷。通过推断数据变体并渲染固定状态，快速识别组件在内容异常时的表现，提供可视化的缺陷报告。
需要对单个UI组件进行视觉健壮性检查
需要验证组件在极端数据或状态下的渲染效果
npx skills add jakubkrehel/skills --skill break -g -y
将Figma设计或图片转换为代码，复用项目现有Token和组件，确保UI与设计稿像素级一致。
根据Figma链接生成前端页面
根据设计截图还原UI界面
npx skills add jakubkrehel/skills --skill build-design -g -y
分析网站或视觉效果的构建方式，通过URL或截图解析前端技术栈、样式系统及特效实现细节。支持脚本化浏览器和静态抓取，强调客观解释而非评判。
询问特定网站或效果的技术实现细节
提供URL或截图要求解析前端架构与渲染逻辑
npx skills add jakubkrehel/skills --skill explain-interface -g -y
审查代码变更中的界面问题，涵盖无障碍、布局、排版等。优先解析变更范围，仅报告变更引发的退化，排除已有问题及非界面类关注点。
用户要求审查特定分支或 Pull Request 的界面影响
工作区存在未提交更改且需评估其界面退化风险
npx skills add jakubkrehel/skills --skill interface-review -g -y
自动化渲染指定组件的所有状态，通过注入模拟数据和切换器，在独立页面中可视化展示加载、错误、权限等场景，辅助前端开发进行视觉调试与状态覆盖检查。
需要快速预览组件所有状态
前端组件多状态测试
UI视觉走查
npx skills add jakubkrehel/skills --skill state-machine -g -y
将物体、照片或CAD模型转换为精确的技术图纸，支持多视图生成与标注。提供交互式查看器及SVG/PNG/PDF下载功能，确保几何与注释的准确性。
需要将实物或描述转化为技术工程图
需要生成带有详细标注和多视角的机械制图
npx skills add jakubkrehel/skills --skill technical-drawing -g -y
该技能用于为单个 UI 组件构建三个基于不同设计轴（如结构、密度等）的变体，供用户选择。它要求变体满足无障碍和基础设计规范，通过对比不同设计方案辅助前端界面迭代与决策。
需要生成同一 UI 组件的不同设计方案以进行对比选择
对现有 UI 组件进行多版本原型探索
npx skills add jakubkrehel/skills --skill variant -g -y
