Agent Skill

Oil UI skill

设计、改进和评审网站、App、后台与组件的界面：探索设计方向、生成多风格同屏对比页，并基于真实截图打磨视觉层级；按请求交付对比页、设计说明、设计稿或可运行界面。只负责设计判断，不用于纯业务逻辑、接口构建、无界面变化的代码整理，或改法已完全明确的日常修改（如改文案、调数量、删指定元素、复用现有样式，哪怕带有“优化”字样）。已安装 oil-ui-pro 时交给 oil-ui-pro。

2.0kMIT

always on

140 tokname + description

once used

4,631 tokSKILL.md body

bundled files

286 scripts

repo stars

2.0kGitHub

Install the Oil UI skill

Skills CLI (Claude Code, Codex, Cursor and others)

npx skills add https://github.com/oil-oil/oil-ui --skill oil-ui

Claude Code, by hand (all projects)

git clone --depth 1 https://github.com/oil-oil/oil-ui.git /tmp/oil-ui
mkdir -p ~/.claude/skills
cp -R /tmp/oil-ui ~/.claude/skills/oil-ui

For one project only, copy the folder into .claude/skills/ in that project instead. The agent picks it up when a task matches its description.

What it costs your context

Agent Skills load in three steps. Tokens counted with the o200k tokenizer; your model's count will differ a little.

When	What loads	Cost
Every session	Name and description	140 tok
When the agent uses it	The SKILL.md instructions	4,631 tok
Only if opened	28 bundled files (1.4 MB)	varies

Until it is used, oil-ui costs about 9.7× less than the median MCP server we measured (1,363 tokens on every turn). Skills vs MCP study

Checks

Ships scripts the agent can run. Read them before installing.

Pre-approved tools (allowed-tools): Bash(sh *check_update.sh*), Bash(python3 *check_update.py*), Bash(python *check_update.py*), Bash(py -3 *check_update.py*). The agent can use these without asking while the skill is active.

Checked 2026-10-22 · method

What's inside

The headings of its SKILL.md. Read the full file on GitHub.

oil-ui
开始前
选择范围
1. 探索并收敛方向
2. 建立视觉与交互结构
3. 制作并取得实际证据
4. 独立评审与修正
5. 验证与交付
能力边界
完整版提示