Agent Skills
› talebook/talebook
talebook/talebook
GitHub提供 OKLCH 色彩空间规范,支持格式转换、色板生成、对比度检测及 Tailwind v4 主题配置。适用于前端视觉设计、无障碍优化及语义化颜色系统构建。
安装全部 Skills
npx skills add talebook/talebook --all -g -y
集合内 Skills (11)
提供 OKLCH 色彩空间规范,支持格式转换、色板生成、对比度检测及 Tailwind v4 主题配置。适用于前端视觉设计、无障碍优化及语义化颜色系统构建。
OKLCH 色彩转换
色板生成
对比度检查
Tailwind 主题配置
npx skills add talebook/talebook --skill better-colors -g -y
协调多个领域技能对界面进行整体审查,解析范围与模式,整合各领域发现并输出统一评级结论。
better-interface
holistic interface review
review the whole screen
npx skills add talebook/talebook --skill better-interface -g -y
提供UI细节打磨的设计工程原则,涵盖动画、图标、表面样式等视觉优化。用于构建组件、审查前端代码及实现微交互,提升界面精致度与体验一致性。
UI polish
make it feel better
feels off
stagger animations
border radius
optical alignment
npx skills add talebook/talebook --skill better-ui -g -y
专注于UX写作和界面文案的Skill,涵盖按钮、错误消息等用户可见文本的撰写与审查。提供语气一致性、简洁性及无障碍协作原则,适用于所有面向用户的界面文案场景。
UX writing
microcopy
interface copy
product copy
button labels
error messages
npx skills add talebook/talebook --skill better-writing -g -y
提供独特视觉设计指导,帮助构建或重塑UI。强调基于主题的个性化选择,涵盖色彩、排版、布局和动效,避免模板化默认值,旨在打造具有辨识度的前端界面风格。
需要创建新的用户界面
对现有UI进行视觉重塑
寻求非模板化的设计风格建议
npx skills add talebook/talebook --skill frontend-design -g -y
用于审查代码变更范围,确定目标分支或PR,识别受影响的文件表面,排除无关内容,并处理无变更情况。专注于接口质量而非正确性或安全,为后续审查提供范围依据。
用户请求审查特定分支、PR或未提交的更改
需要确定代码变更的影响范围和受影响的文件
npx skills add talebook/talebook --skill interface-review -g -y
基于仓库证据进行产品策划、竞品调研、路线图规划及PRD撰写,涵盖用户建模、机会树分析与UI/UX评审,辅助产品决策。
产品策划与需求定义
竞品研究与行业分析
版本路线图制定
PRD编写
用户体验与设计评审
npx skills add talebook/talebook --skill talebook-product -g -y
审查UI代码是否符合Web界面指南,支持检查无障碍、UX审计及最佳实践。通过获取最新规则并对比指定文件,以简洁格式输出合规性问题。
review my UI
check accessibility
audit design
review UX
npx skills add talebook/talebook --skill web-design-guidelines -g -y
提供前端界面无障碍工程指导,涵盖焦点管理、键盘支持、ARIA语义、表单及屏幕阅读器优化。用于构建或审查UI组件时确保符合WCAG标准,解决键盘导航和读屏问题。
用户请求提升界面无障碍性
报告键盘或屏幕阅读器兼容性问题
涉及A11y、WCAG、ARIA、焦点环等关键词
npx skills add talebook/talebook --skill better-accessibility -g -y
提供Web界面布局结构的设计原则,涵盖分组、对齐、间距、响应式断点及RTL处理。用于指导页面或组件的结构化构建、控件对齐、空间管理及前端代码的布局审查。
构建或重构UI组件的布局结构
调整控件的对齐与间距
实现响应式断点与自适应布局
处理RTL语言方向的布局适配
审查前端代码中的布局合理性
npx skills add talebook/talebook --skill better-layout -g -y
专注于Web排版优化的技能,涵盖字体选择、变量字体配置、间距缩放、文本换行截断及无障碍对比度检查。用于前端代码审查与样式实现,确保文本渲染质量与可读性。
前端组件文本样式调整
字体格式与加载优化
排版层级与间距规范审查
npx skills add talebook/talebook --skill better-typography -g -y


