Agent Skills
› bitjaru/styleseed
bitjaru/styleseed
GitHub针对组件或页面进行无障碍审计，依据WCAG 2.2 AA标准检查对比度、键盘导航等合规性，并自动修复问题。
Install All Skills
npx skills add bitjaru/styleseed --all -g -y
Skills in Collection (47)
针对组件或页面进行无障碍审计，依据WCAG 2.2 AA标准检查对比度、键盘导航等合规性，并自动修复问题。
用户要求审查前端组件的无障碍访问性
需要修复违反WCAG标准的UI元素
npx skills add bitjaru/styleseed --skill ss-a11y -g -y
基于尼尔森十大可用性启发式原则和现代移动端最佳实践，对界面进行UX审计，检查加载状态、一致性、错误预防等体验问题。
需要评估界面用户体验质量
检查交互设计是否符合可用性标准
npx skills add bitjaru/styleseed --skill ss-audit -g -y
基于 StyleSeed 方法构建 UI 界面。通过建立规则集、组合设计语法与品牌配方，执行代码评分与像素级验证循环，确保实现符合设计规范并呈现最终成果。
需要按照特定设计系统或品牌规范生成前端界面
要求对 UI 实现进行自动化质量评分和视觉验收
npx skills add bitjaru/styleseed --skill ss-build -g -y
用于根据 StyleSeed 设计规范生成新的 UI 组件。需读取设计规则、Token 和参考模式，严格遵循函数声明、语义化 Token、无障碍及导出规范，将组件放置于指定目录。
需要生成新的 UI 组件
按照 StyleSeed 规范创建前端界面元素
npx skills add bitjaru/styleseed --skill ss-component -g -y
生成符合随意但礼貌语气的UX微文案，包括按钮、错误提示、空状态和Toast。遵循简洁、主动语态等原则，禁止用于长文或翻译。
需要生成界面微文案
优化按钮或错误提示文本
npx skills add bitjaru/styleseed --skill ss-copy -g -y
用于协调调整设计系统单一维度的确定性转换，如密度或圆角。通过读取配置、移动刻度、应用全局Token并尊重约束规则，确保UI变更一致且符合规范，避免手动调整的偏差。
用户要求增加或减少特定设计属性（如更紧凑、更锐利）
需要系统性调整多个组件以保持一致性而非局部修改
npx skills add bitjaru/styleseed --skill ss-dial -g -y
为组件或页面生成加载、空数据、错误和成功四种用户反馈状态代码，遵循设计规范与交互规则。
需要为数据依赖区域添加骨架屏、空状态、错误提示或操作成功反馈
实现组件的多态展示逻辑
npx skills add bitjaru/styleseed --skill ss-feedback -g -y
专注于设计用户流程和导航结构，遵循UX原则如渐进式披露和希克定律。提供ASCII流程图、屏幕清单及边缘情况说明，并生成脚手架页面代码。
需要设计用户操作流程
规划应用导航结构
构建信息架构
npx skills add bitjaru/styleseed --skill ss-flow -g -y
将人类批准的UI设计修正转化为通用规则，严格遵循隐私最小化原则。流程包括初始化、草稿生成、人工审核及可选分享包准备，禁止上传代码或敏感数据，确保本地安全与合规。
用户要求记住设计经验
用户要求从已接受的修正中提炼通用规则
用户要求审查设计决策并准备可复用规则
npx skills add bitjaru/styleseed --skill ss-learn -g -y
快速自动化设计系统 lint，通过 grep 扫描检测硬编码颜色、原始像素值、旧语法等常见违规，确保样式一致性。
代码变更后的快速样式合规检查
检测设计系统规范漂移
npx skills add bitjaru/styleseed --skill ss-lint -g -y
将用户描述的动效风格或组件场景映射为 Framer Motion 代码种子，实现从自然语言到 React 动效的精准转换。
需要将 UI 组件添加特定风格的入场、悬停或点击动效
根据品牌调性或关键词（如 bouncy, smooth）生成 framer-motion 代码
npx skills add bitjaru/styleseed --skill ss-motion -g -y
根据 StyleSeed 设计语法和配置，快速生成符合品牌规范的新产品页面或屏幕组件代码。
需要创建新的产品页面
基于设计系统生成前端页面骨架
npx skills add bitjaru/styleseed --skill ss-page -g -y
根据 StyleSeed 语法和品牌配方，组合现有 UI 原语生成可复用的 UI 组件模式。支持布局、数据展示和交互等多种模式，确保符合设计规范并与页面功能关联。
需要组合多个基础组件构建复杂 UI 模块
根据品牌配方生成特定类型的界面模式
npx skills add bitjaru/styleseed --skill ss-pattern -g -y
将截图、链接或设计稿编译为项目本地的 StyleSeed 设计语法，包含证据、置信度及反模式分析。通过验证屏幕确保设计一致性，适用于用户提供的参考设计未被模型覆盖的场景。
用户提供设计参考（截图、URL、Figma导出）
需要将外部 UI 风格转化为项目本地设计语法
npx skills add bitjaru/styleseed --skill ss-reference -g -y
解析 StyleSeed 上下文，编译确定性规则包，输出语法、适配器、领域等配置。用于在构建前或 STYLESEED.md 变更时生成有效规则，避免加载完整手册。
STYLESEED.md 发生变更
更新 StyleSeed 配置
Agent 构建或设置前需加载规则
npx skills add bitjaru/styleseed --skill ss-resolve -g -y
应用风格种子审美配置，在不改变输出语法和核心设计判断的前提下协调视觉元素。需验证锁定状态，选择单一预设文件并应用其参数，保留品牌值，更新配置文件并通过评分与验证确保渲染效果。
需要统一或调整界面视觉风格时
应用特定审美预设（如技术、编辑、极简）到现有设计中时
npx skills add bitjaru/styleseed --skill ss-restyle -g -y
审查 UI 代码是否符合设计系统规范、无障碍标准及最佳实践，涵盖 Token 合规、组件约定、可访问性、性能等维度。
需要检查 UI 代码与设计系统一致性时
评估前端组件的可访问性和性能时
npx skills add bitjaru/styleseed --skill ss-review -g -y
对视觉工件按 StyleSeed 规则集进行 0-100 分质量评分，提供类别分解、证据及优先修复建议。需先解析有效规则集，再基于色彩、排版等八项指标扣分评估。
需要量化 UI/UX 实现质量时
生成设计合规性审计报告时
npx skills add bitjaru/styleseed --skill ss-score -g -y
StyleSeed初始化向导，引导用户配置输出语法、领域、页面类型及品牌/调色板配方，为前端界面脚手架生成提供设计约束。
需要从零开始构建新的UI界面或产品原型
用户希望基于StyleSeed方法规范选择设计风格和语义配色
npx skills add bitjaru/styleseed --skill ss-setup -g -y
用于将产品简报转化为三个创意方向、交互计划、UI原型及展示视频的全流程技能。通过角色侦察、多方案生成与用户选择，产出结构化设计资产，适用于概念验证和交互探索。
需要基于产品简报生成多个创意设计方案
进行App或Web的交互原型探索
客户概念演示或UI方向调研
npx skills add bitjaru/styleseed --skill ss-studio -g -y
管理 StyleSeed 设计令牌，支持从主色生成语义调色板、查看、添加和修改颜色/排版等令牌，确保 JSON 与 CSS 同步。
用户需要提供品牌配色方案或色彩组合建议
用户需要生成或更新前端设计令牌文件
npx skills add bitjaru/styleseed --skill ss-tokens -g -y
通过渲染UI并截图进行视觉验证，检查字体、颜色、布局等像素级细节，确保符合设计规范。
需要验证UI视觉呈现效果
代码审查后需进行最终视觉验收
npx skills add bitjaru/styleseed --skill ss-verify -g -y
针对 StyleSeed 组件或页面进行无障碍审计，依据 WCAG 2.2 AA 标准检查对比度、键盘导航等，并自动修复问题。
需要检查代码的无障碍合规性
修复组件的可访问性问题
npx skills add bitjaru/styleseed --skill ss-a11y -g -y
基于尼尔森十大可用性原则和现代移动UX最佳实践，对屏幕界面进行用户体验审计，识别并检查交互、视觉及可用性缺陷。
需要评估移动端界面的可用性和用户体验问题
依据尼尔森启发式规则审查UI设计
npx skills add bitjaru/styleseed --skill ss-audit -g -y
基于 StyleSeed 规范构建前端界面的技能。通过解析规则集、应用品牌配方与约束，执行代码评分与像素级视觉验证循环，确保 UI 符合设计标准并生成最终交付物。
用户要求按照 StyleSeed 规范创建或重构界面
需要执行 UI 组件的代码质量评分和视觉一致性检查
npx skills add bitjaru/styleseed --skill ss-build -g -y
根据 StyleSeed 设计规范生成新的 UI 组件。读取项目设计令牌、规则及参考文件，严格遵循函数声明、类名合并、语义化颜色、排版及无障碍等约定，输出符合标准的 React 组件代码。
需要创建新的 UI 组件
遵循 StyleSeed 设计规范生成前端界面元素
npx skills add bitjaru/styleseed --skill ss-component -g -y
用于生成符合特定语气规范的UX微文案，涵盖按钮、错误提示等场景。
需要生成按钮标签
需要生成错误消息
npx skills add bitjaru/styleseed --skill ss-copy -g -y
将设计调整指令转化为确定性的系统级变更，通过协调更新多个Token并遵守约束规则，确保UI风格一致。
用户要求增加或减少设计的密度、圆角等单一维度特征
需要系统性应用视觉调整而非局部修改
npx skills add bitjaru/styleseed --skill ss-dial -g -y
为组件或页面生成加载、成功、错误和空状态的用户反馈UI代码，遵循设计规范并实现骨架屏、重试及Toast通知等交互逻辑。
需要添加数据加载或操作反馈状态
前端组件状态管理优化
npx skills add bitjaru/styleseed --skill ss-feedback -g -y
设计用户流程和导航结构，遵循UX原则如渐进式披露和希克定律。输出ASCII流程图、屏幕清单及边缘情况处理，辅助前端页面搭建。
需要设计用户操作流程
规划应用导航结构
优化信息架构
npx skills add bitjaru/styleseed --skill ss-flow -g -y
将人工批准的UI设计修正转化为通用规则，通过本地CLI进行隐私脱敏、草稿生成、人工审核及可选分享包准备，不传输代码或敏感数据。
用户要求记住或学习已接受的设计修正
用户要求从成功设计中提取可复用规则
npx skills add bitjaru/styleseed --skill ss-learn -g -y
快速自动化设计系统代码检查，通过 grep 扫描硬编码颜色、原始像素值等常见违规项，确保样式规范一致性。
检测设计系统违规
文件变更后的快速 lint
npx skills add bitjaru/styleseed --skill ss-lint -g -y
将用户描述的风格或场景映射为 framer-motion 代码种子，适用于 React 组件的入场、退出、悬停等交互动画生成。
需要将自然语言风格描述转化为 framer-motion 代码
根据 UI 组件类型（如按钮、弹窗）推荐合适的交互动画
npx skills add bitjaru/styleseed --skill ss-motion -g -y
基于 StyleSeed 设计系统规范，为新产品页面或屏幕生成脚手架代码。自动解析设计规则、应用品牌配方与适配器，构建符合响应式要求的页面结构并执行质量验证。
需要创建新的产品页面
根据 StyleSeed 语法生成页面骨架
npx skills add bitjaru/styleseed --skill ss-page -g -y
基于 StyleSeed 语法和品牌配方，组合现有 UI 原语生成可复用的 UI 模式组件。支持布局、数据展示及交互等多种类型，强调遵循设计规范和语义化属性。
需要生成复合 UI 组件
根据品牌配方组装界面模式
npx skills add bitjaru/styleseed --skill ss-pattern -g -y
将设计参考（截图、URL、Figma）编译为项目本地 StyleSeed 输出语法，包含证据、令牌、置信度及反模式，并执行验证流程。
用户提供设计参考且 StyleSeed 未建模
需要将视觉参考转化为结构化设计规则
npx skills add bitjaru/styleseed --skill ss-reference -g -y
解析并编译 StyleSeed 设计系统规则包，生成确定的上下文配置。通过脚本读取 STYLESEED.md 或参数，输出语法、适配器、领域等配置，管理版本锁定与调色板生成，避免加载完整规则手册，提升构建效率。
STYLESEED.md 发生变更时
Agent 准备进行 Setup 或 Build 前
需要更新 StyleSeed 配置时
检测到上下文漂移需检查时
npx skills add bitjaru/styleseed --skill ss-resolve -g -y
应用单一StyleSeed美学配置文件以统一视觉风格，不改变输出语法或核心设计判断。需验证配置、选择预设、应用参数并更新文档，确保兼容品牌规范并通过评分验证。
需要统一界面视觉风格
调整产品外观配色或动效
应用特定美学预设
npx skills add bitjaru/styleseed --skill ss-restyle -g -y
用于审查UI代码是否符合设计系统规范、无障碍标准及最佳实践。检查设计Token合规性、组件约定、可访问性、性能及排版等，确保前端界面质量与一致性。
需要检查UI代码的设计系统合规性
评估前端界面的无障碍适配情况
审查React/Tailwind组件的最佳实践
npx skills add bitjaru/styleseed --skill ss-review -g -y
对视觉产物的实现质量进行0-100分评分，依据StyleSeed规则集提供分类明细、证据及优先修复建议。
需要评估UI/视觉实现质量
获取基于设计规范的量化分数
npx skills add bitjaru/styleseed --skill ss-score -g -y
StyleSeed 初始化工具，引导用户选择输出语法、领域、页面类型、品牌配方等配置项，为生成首个界面做准备。
需要初始化 StyleSeed 配置
选择设计方法和品牌样式
npx skills add bitjaru/styleseed --skill ss-setup -g -y
将产品简报转化为三个创意方向、风格种子交互计划及UI原型，通过脚本自动化执行从参考侦察、方向生成到用户选择的全流程。
需要多屏幕交互概念探索
基于简报生成UI原型与资产
客户端概念设计验证
npx skills add bitjaru/styleseed --skill ss-studio -g -y
管理 StyleSeed 设计令牌，支持从关键色生成语义调色板、查看或增改令牌文件。用于前端主题设计与实现，确保 JSON 与 CSS 同步及无障碍对比度。
用户需要提供基于品牌色的语义调色板
用户询问颜色搭配方案
用户需要创建或修改 light/dark 主题角色
用户需要生成用于实现的令牌文件
npx skills add bitjaru/styleseed --skill ss-tokens -g -y
通过渲染UI并截图，以像素级视觉审查验证样式规则合规性。作为最终检查环节，弥补代码静态扫描的不足，确保实际视觉效果符合设计规范，提升用户感知质量。
需要验证UI组件或页面的实际视觉呈现效果
代码评分通过后需进行最终的视觉一致性检查
检查字体加载、颜色搭配、布局排版等视觉细节
npx skills add bitjaru/styleseed --skill ss-verify -g -y
基于StyleSeed引擎对React/Tailwind等UI代码进行设计审查，评估一致性、色彩、层级等7项指标并打分，提供修复建议以消除AI生成痕迹。
UI界面看起来不专业或未完成
需要上线前的设计评分检查
要求提升界面专业度和设计感
npx skills add bitjaru/styleseed --skill styleseed-design-review -g -y
检查并更新 StyleSeed 引擎版本，确保规则与技能同步。通过只读检查、生成边界报告并使用原渠道刷新安装，严格保留项目自有代码与设计决策，重新编译并验证有效包。
用户请求更新 StyleSeed 引擎或技能包
需要保持项目规则与上游最新版本同步
npx skills add bitjaru/styleseed --skill ss-update -g -y
Dependencies:
bitjaru/styleseed
用于检查和更新 StyleSeed 引擎载荷，保留项目自有设计决策，重新编译并验证有效规则包。
需要升级或同步 StyleSeed 引擎版本时
检查已安装 Skill 的修订版本与发布版本是否一致时
npx skills add bitjaru/styleseed --skill ss-update -g -y
Dependencies:
bitjaru/styleseed
