Agent Skills
› bitjaru/styleseed
bitjaru/styleseed
GitHub针对 StyleSeed 项目组件或页面进行静态无障碍审计,检查 WCAG 2.2 AA 合规性(如对比度、键盘导航),并自动修复问题。
Install All Skills
npx skills add bitjaru/styleseed --all -g -y
Skills in Collection (50)
针对 StyleSeed 项目组件或页面进行静态无障碍审计,检查 WCAG 2.2 AA 合规性(如对比度、键盘导航),并自动修复问题。
需要检查前端组件的无障碍访问性
修复违反 WCAG 标准的 UI 代码
npx skills add bitjaru/styleseed --skill ss-a11y -g -y
基于尼尔森可用性启发式规则进行屏幕UX审计,检查状态可见性、用户控制、一致性等。适用于UI设计评审与体验优化,排除无障碍及品牌合规场景。
需要评估界面用户体验质量
检查交互是否符合可用性原则
npx skills add bitjaru/styleseed --skill ss-audit -g -y
基于 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微文案,包括按钮、错误提示等。优先解析项目注册表中的特定制品文件,严格遵循设计语言规范与语气原则,不适用于长文或翻译。
需要生成界面按钮标签
编写错误提示信息
创建空状态文案
生成Toast通知文本
npx skills add bitjaru/styleseed --skill ss-copy -g -y
用于统一调整设计系统单一维度的确定性技能。通过读取锁文件,沿预设轴(如密度、圆角)移动一步,应用全局Token变更并校验规则与质量门禁,确保视觉一致性。
用户希望微调设计的特定属性(如更紧凑、更扁平)
需要系统性改变设计参数而非整体风格
npx skills add bitjaru/styleseed --skill ss-dial -g -y
为组件或页面添加加载、成功、错误和空状态等用户反馈机制,遵循设计语言规范。
需要实现数据依赖区域的四种UI状态
优化前端用户体验的反馈交互
npx skills add bitjaru/styleseed --skill ss-feedback -g -y
专注于设计用户流程和导航结构,遵循UX模式。通过读取设计系统参考和组件库存,应用渐进式披露等原则,生成包含流程图、屏幕清单及边缘情况的输出,并调用ss-page生成页面文件。
需要设计用户操作流程时
规划应用或页面的导航结构时
npx skills add bitjaru/styleseed --skill ss-flow -g -y
将人类批准的UI设计修正转化为通用规则,严格遵循隐私最小化原则。流程包括初始化、草稿生成、人工审核及可选分享包准备,禁止上传代码或敏感数据,确保本地安全与合规。
用户要求记住设计经验
用户要求从已接受的修正中提炼通用规则
用户要求审查设计决策并准备可复用规则
npx skills add bitjaru/styleseed --skill ss-learn -g -y
快速自动化设计系统违规检测,通过扫描代码识别硬编码颜色、原始像素值等常见问题。支持基于注册表的精确制品边界检查与机器可读输出,适用于提交后即时反馈。
用户要求快速检查设计系统规范
需要检测前端组件中的样式违规
CI流程中执行快速Lint检查
npx skills add bitjaru/styleseed --skill ss-lint -g -y
将自然语言或品牌词映射为 Framer Motion 种子配置,应用于 React 组件动画。支持基于情绪和用例的推荐,严格限定于 motion.X JSX 场景。
用户描述 UI 元素的动画风格(如弹性、丝滑)
指定特定品牌默认动效风格
需要为按钮、弹窗等组件选择合适入场/交互动画
npx skills add bitjaru/styleseed --skill ss-motion -g -y
基于 StyleSeed 规范脚手架化新产品页面,解析设计令牌与组件模式,生成符合品牌配方和响应式约束的 React 页面代码。
需要创建新的产品页面或屏幕
根据 StyleSeed 输出语法生成前端页面结构
npx skills add bitjaru/styleseed --skill ss-page -g -y
基于StyleSeed语法和品牌配方,利用现有UI原语组合生成可复用的UI模式组件。严格遵循Registry优先策略,确保组件符合设计规范并具备功能性关系。
需要组合多个UI原语构建复杂界面区块
根据品牌配方生成特定布局或交互模式
npx skills add bitjaru/styleseed --skill ss-pattern -g -y
将截图、URL或Figma设计稿编译为项目本地的StyleSeed样式语法,包含证据、Token、置信度及反模式分析,并执行验证流程。
用户提供UI设计参考素材
需要将现有界面转换为StyleSeed规范
npx skills add bitjaru/styleseed --skill ss-reference -g -y
根据 STYLESEED.md 或显式参数,编译生成确定性的 StyleSeed 规则包(语法、适配器、调色板等)。支持从锁文件解析或手动指定配置,用于在构建前确定设计上下文,避免加载完整手册。
STYLESEED.md 发生变更时
需要更新 StyleSeed 配置时
Agent 准备执行 setup 或 build 之前
npx skills add bitjaru/styleseed --skill ss-resolve -g -y
应用 StyleSeed 美学配置文件,在保持输出语法和核心设计判断不变的前提下,协调视觉风格。包含注册表优先的工件边界解析、严格的配置流程及评分验证规则。
需要调整界面美学风格
应用预设视觉配置文件
执行视觉一致性校验
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 设计一致性。
需要量化评估 UI/视觉组件的设计规范符合度
需要获取视觉工件的质量评分及优先级修复清单
在提交前或审查阶段进行视觉质量的自动化打分
npx skills add bitjaru/styleseed --skill ss-score -g -y
StyleSeed初始化技能,通过向导引导用户配置输出语法、领域、页面类型、品牌配方及语义调色板,为React/Tailwind项目生成首个界面设计骨架。
新建StyleSeed项目或首次初始化
需要为特定产品选择设计方法和品牌视觉规范
npx skills add bitjaru/styleseed --skill ss-setup -g -y
将产品简报转化为三个创意方向,通过角色侦察、方案生成与用户选择,最终产出风格种子交互计划、UI原型及展示视频。支持基于制品注册表的定向互动概念构建。
需要多个创意方向探索的产品概念设计
生成UI原型或互动演示
品牌视觉风格与交互逻辑的探索
npx skills add bitjaru/styleseed --skill ss-studio -g -y
管理 StyleSeed 设计令牌,支持从关键色生成语义调色板、查看及修改令牌文件。适用于品牌色设定、主题角色配置及前端实现所需的令牌文件生成与校验。
用户指定品牌颜色并需要生成配套色系
询问颜色搭配建议或需要光/暗模式角色定义
需要为前端实现准备和修改 StyleSeed 令牌文件
npx skills add bitjaru/styleseed --skill ss-tokens -g -y
视觉验证技能,通过渲染UI并截图检查像素级表现(布局、字体、色彩),修复后重渲染直至符合StyleSeed规则。作为代码审查后的最终质量关卡,确保设计观感达标。
需要验证UI视觉呈现效果时
代码审查通过后进行最终视觉验收时
npx skills add bitjaru/styleseed --skill ss-verify -g -y
StyleSeed请求路由器,根据项目上下文将用户的一般性帮助请求路由至唯一的工作流。优先解析注册表中的工件边界,避免发散执行,通过受限澄清确定具体任务并调用相应技能。
用户询问 StyleSeed 通用帮助
未指定具体 ss-* 技能的 StyleSeed 相关操作
npx skills add bitjaru/styleseed --skill styleseed -g -y
将人类批准的UI设计修正转化为隐私最小化的通用规则,支持本地草稿、人工审核及可选分享包准备。
用户要求记住或学习设计决策
请求从已接受的修正中提炼通用规则
npx skills add bitjaru/styleseed --skill ss-learn -g -y
用于审计组件或页面的无障碍问题并修复,基于WCAG 2.2 AA标准检查对比度、键盘导航等。
需要检查前端组件的无障碍合规性
修复UI元素的色弱、键盘操作等问题
npx skills add bitjaru/styleseed --skill ss-a11y -g -y
基于尼尔森启发式原则和现代移动端UX最佳实践,对界面进行可用性审计。支持通过Registry解析特定Artifact,严格区分于无障碍、设计令牌及文案审查场景,确保交互体验合规。
需要评估界面可用性问题
检查是否符合尼尔森十大原则
审核移动端UX最佳实践
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 设计规范的 React UI 组件,严格遵循设计令牌、语义化属性及无障碍标准。
需要创建新的 UI 组件
遵循 StyleSeed 规范生成前端代码
npx skills add bitjaru/styleseed --skill ss-component -g -y
生成符合休闲礼貌语气的UX微文案,涵盖按钮、错误提示、空状态和Toast。基于设计语言规范,遵循主动语态和简洁原则,禁止用于长文或翻译。
需要生成界面按钮标签
编写错误提示信息
创建空状态引导文案
设计Toast通知内容
npx skills add bitjaru/styleseed --skill ss-copy -g -y
用于将单一设计维度(如密度、圆角)按确定性阶梯调整,确保全局 Token 一致更新并遵守约束规则。
用户要求增加或减少特定设计属性
需要协调多个设计令牌以保持一致性
npx skills add bitjaru/styleseed --skill ss-dial -g -y
为组件或页面添加加载、成功、错误、空状态等用户反馈界面,基于Registry规范读取设计语言并生成对应UI代码。
需要为数据依赖区域实现Loading/Empty/Error/Success状态
前端组件交互反馈开发
npx skills add bitjaru/styleseed --skill ss-feedback -g -y
专注于设计用户流程和导航结构,遵循UX最佳实践。基于注册表优先原则,结合信息架构与导航模式生成流程地图、屏幕清单及脚手架页面,适用于产品功能流设计。
需要设计用户操作流程时
规划应用或页面的导航结构时
定义多步骤任务(如表单、结账)的流程时
npx skills add bitjaru/styleseed --skill ss-flow -g -y
将人工批准的UI设计修正转化为通用规则,通过本地CLI进行隐私脱敏、草稿生成、人工审核及可选分享包准备,不传输代码或敏感数据。
用户要求记住或学习已接受的设计修正
用户要求从成功设计中提取可复用规则
npx skills add bitjaru/styleseed --skill ss-learn -g -y
快速自动化设计系统代码检查,通过grep扫描检测硬编码颜色、原始像素值等常见违规。支持Registry优先解析与SARIF输出,适用于前端开发中的样式规范校验。
需要快速扫描设计系统违规时
文件变更后自动运行lint检查时
npx skills add bitjaru/styleseed --skill ss-lint -g -y
将用户描述的风格或场景映射为 StyleSeed 运动种子,生成 framer-motion React 代码。支持基于情绪词汇和使用场景的自动推荐,严格限定于组件级动画应用。
需要为 UI 组件添加特定风格的入场、退出或交互动画
根据品牌调性或情绪词(如 bouncy, smooth)选择运动模式
针对特定交互元素(如按钮、弹窗、列表项)推荐最佳动画效果
npx skills add bitjaru/styleseed --skill ss-motion -g -y
基于 StyleSeed 规范脚手架化新产品页面,支持解析设计方法、应用适配器与品牌配方,生成符合响应式及语义规范的 React 组件代码。
需要创建新的产品页面或屏幕
根据 StyleSeed 语法生成前端页面结构
npx skills add bitjaru/styleseed --skill ss-page -g -y
根据 StyleSeed 语法和品牌配方,利用现有基础组件组合生成可复用的 UI 模式。支持布局、数据展示及交互等多种类型,强调语义化 token 使用与组件复用,避免重复造轮子。
需要组合多个组件形成特定 UI 结构
依据品牌规范生成界面模式
npx skills add bitjaru/styleseed --skill ss-pattern -g -y
将截图、URL或Figma等设计参考编译为项目本地的StyleSeed风格语法,包含证据、令牌和验证流程。
用户提供UI设计参考素材
需要将视觉设计转化为代码级样式规则
npx skills add bitjaru/styleseed --skill ss-reference -g -y
解析 StyleSeed 上下文,编译确定性规则包。支持从锁定文件或显式参数生成语法、适配器及调色板等配置,用于构建前的环境准备。
StyleSeed.md 变更
更新 StyleSeed 配置
构建或设置前需要加载精简规则集
npx skills add bitjaru/styleseed --skill ss-resolve -g -y
应用 StyleSeed 美学配置文件,在保持输出语法和核心设计不变的前提下协调视觉风格。通过验证锁定、选择配置、应用参数及评分校验,确保界面外观符合预设美学标准。
需要统一或调整产品界面的视觉风格
应用特定的美学配置文件以优化用户体验
npx skills add bitjaru/styleseed --skill ss-restyle -g -y
用于审查UI代码是否符合设计系统规范、无障碍标准及最佳实践。支持注册中心优先模式,检查Token合规、组件约定、a11y、性能等,适用于前端UI质量把控。
审查UI组件代码
检查设计系统规范合规性
评估无障碍访问标准
npx skills add bitjaru/styleseed --skill ss-review -g -y
基于StyleSeed规则集对视觉组件实现质量进行0-100评分,提供分类得分、证据及优先级修复建议,用于追踪UI设计一致性。
需要评估视觉组件的设计规范符合度
获取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 设计令牌,支持从关键色生成语义调色板、查看及修改颜色/排版等令牌文件。适用于品牌色配置、主题角色设置及实现令牌文件生成,仅限 CSS/Tailwind 场景。
用户提供一个品牌主色并需要生成配套色彩系统
询问哪些颜色搭配和谐或需要光/暗模式角色定义
需要创建、查看或更新 StyleSeed 令牌配置文件
npx skills add bitjaru/styleseed --skill ss-tokens -g -y
通过渲染UI并截图,基于StyleSeed规则集进行视觉质量验证与修复,确保最终像素效果符合设计规范。
需要验证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 styleseed -g -y
检查并更新 StyleSeed 引擎载荷,验证修订版本一致性,保留项目设计决策后重新编译验证。适用于维护现有安装,排除首次安装或新增组件场景。
需要更新现有 StyleSeed 安装版本
验证引擎载荷与发布版本的一致性
npx skills add bitjaru/styleseed --skill ss-update -g -y
Dependencies:
bitjaru/styleseed
检查并更新 StyleSeed 引擎载荷,通过精确规则或技能修订保持项目设计决策,重新编译并验证有效包。适用于已有安装的场景。
用户请求更新现有 StyleSeed 安装
需要校验引擎版本与项目配置的一致性
npx skills add bitjaru/styleseed --skill ss-update -g -y
Dependencies:
bitjaru/styleseed


