Agent Skills › o8-run/o8 › o8-ui

o8-ui

GitHub

用于修改或审查UI组件、TSX代码、样式、Hooks及图标，确保遵循内联样式、品牌规范及设计指南。

.agents/skills/o8-ui/SKILL.md o8-run/o8

需要修改前端UI界面审查TSX组件和样式代码

npx skills add o8-run/o8 --skill o8-ui -g -y

More Options

Non-standard path

npx skills add https://github.com/o8-run/o8/tree/main/.agents/skills/o8-ui -g -y

Use without installing

npx skills use o8-run/o8@o8-ui

指定 Agent (Claude Code)

npx skills add o8-run/o8 --skill o8-ui -a claude-code -g -y

安装 repo 全部 skill

npx skills add o8-run/o8 --all -g -y

预览 repo 内 skill

npx skills add o8-run/o8 --list

Frontmatter

{
    "name": "o8-ui",
    "description": "Change or review UI, TSX, styles, hooks, icons, or visual and interaction behavior."
}

UI work

In TSX, add no new CSS classes. Use inline style objects, longhand spacing when values differ, theme variables for themeable surfaces, and the established raw-SVG icon pattern. Keep hooks unconditional and in stable order.
Brand (logo, colours, type, motion, the working indicator): docs/design/BRAND.md; the build steps are in docs/design/BRAND-IMPLEMENT.md.
UI work: read docs/design/hurttlocker.md, then docs/design/DESIGN.md and docs/design/STYLEGUIDE.md.