Agent Skills
› jakubkrehel/skills
jakubkrehel/skills
GitHub提供前端界面无障碍工程指南，涵盖原生元素优先、焦点环样式、键盘导航支持、模态框焦点管理及触控目标尺寸等规范，确保产品符合WCAG标准。
Install All Skills
npx skills add jakubkrehel/skills --all -g -y
Skills in Collection (11)
提供前端界面无障碍工程指南，涵盖原生元素优先、焦点环样式、键盘导航支持、模态框焦点管理及触控目标尺寸等规范，确保产品符合WCAG标准。
构建或审查UI组件
报告键盘或屏幕阅读器问题
涉及a11y、WCAG、ARIA、focus ring等关键词
npx skills add jakubkrehel/skills --skill better-accessibility -g -y
定义数字产品的色彩系统规范，涵盖调色板生成、主题适配及无障碍对比度验证。指导如何构建色阶、命名Token并统一视觉语言，确保色彩在亮暗模式下的准确渲染与可维护性。
创建或扩展产品调色板
实现亮色/暗色主题切换
审计代码库中的颜色使用
npx skills add jakubkrehel/skills --skill better-colors -g -y
跨学科界面协调技能，将界面路由至各专项技能收集证据并生成综合评审结论。负责范围界定、变更流转及最终裁决，不重复具体领域规则。
holistic interface review
review the whole screen
better-interface
npx skills add jakubkrehel/skills --skill better-interface -g -y
前端布局规范，指导页面结构、间距、对齐及响应式适配。涵盖分组、控件区分、逻辑属性使用、阅读顺序及渐进式披露等原则，确保视觉层级与交互可用性。
页面或组件结构搭建
小尺寸屏幕下的折叠策略
前端代码布局审查
间距与对齐调整
RTL布局处理
npx skills add jakubkrehel/skills --skill better-layout -g -y
专注于Web排版规范，涵盖字体选择、类型比例设置及文本样式化。指导woff2加载、变量字体属性使用、标题层级管理及文本截断等细节，确保跨设备渲染一致性与可读性。
字体加载与格式选择
设置类型比例与层级
文本截断与换行处理
npx skills add jakubkrehel/skills --skill better-typography -g -y
提供UI精细化设计原则，规范动画、阴影、对齐等视觉细节的具体参数与实现方式，用于提升界面质感与交互流畅度。
构建UI组件
实现动画或悬停状态
处理视觉细节工作
界面感觉不对劲时进行审查
npx skills add jakubkrehel/skills --skill better-ui -g -y
专注于UX文案和界面文本的写作与审查指南。提供关于语气、一致性、简洁性及无障碍性的最佳实践，适用于按钮、错误信息等用户可见文本的创作与优化。
编写用户界面文案
审查微复制内容
优化错误消息或占位符文本
统一产品语调与风格
npx skills add jakubkrehel/skills --skill better-writing -g -y
针对单一组件，基于其 Props、状态及数据推断真实使用场景，构建隔离页面渲染各场景以生成视觉报告。旨在发现组件在极端或异常内容下的视觉破损，而非评判设计美感或进行代码审查。
需要检查单个 UI 组件在不同数据长度、状态或容器宽度下是否出现布局崩坏
验证组件对最坏情况（worst-case）内容的防御能力
npx skills add jakubkrehel/skills --skill break -g -y
分析前端界面的构建方式，通过URL或截图解析技术栈、样式系统及特效实现层。
询问界面某部分如何构建
询问整个站点的前端架构
npx skills add jakubkrehel/skills --skill explain-interface -g -y
审查代码变更对接口/界面的影响，评估界面质量而非正确性或安全。自动解析PR、分支或未提交更改的范围，对比Diff并分类发现，聚焦变更引入的问题。
审查Pull Request的界面质量
检查当前分支或工作区的未提交更改
npx skills add jakubkrehel/skills --skill interface-review -g -y
该技能用于为单个UI组件生成三个在结构、密度或排版等核心维度上存在显著差异的版本，供用户通过选择器对比并选出最优方案。强调基于单一主轴变化以保证结果可归因，并确保所有变体均满足无障碍和基础设计规范。
需要为UI组件创建多个设计变体以进行A/B测试或选择
希望探索不同布局、密度或视觉重心的设计方案
npx skills add jakubkrehel/skills --skill variant -g -y
