Theme Factory
anthropics/skills
Applies one of ten preset color and font themes to slide decks, documents or HTML pages, or creates a new theme on the fly after you choose from a showcase.
MallBase Vben Admin 主题与 Modal 表单一致性规则；开发后台页面、组件样式、弹窗表单或明暗色适配时使用。
MITAuto-check passed
Install Admin Theme Consistency
$ npx skills add yyw-code/MallBase --skill admin-theme-consistency -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install yyw-code/MallBase admin-theme-consistency --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/yyw-code/MallBase.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.codex/skills/vbenAdmin/admin-theme-consistency .claude/skills/admin-theme-consistency && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "admin-theme-consistency" agent skill from https://github.com/yyw-code/MallBase/tree/main/.codex/skills/vbenAdmin/admin-theme-consistency into .claude/skills/admin-theme-consistency/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "admin-theme-consistency", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/yyw-code/MallBase/tree/main/.codex/skills/vbenAdmin/admin-theme-consistencyType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add yyw-code/MallBase --skill admin-theme-consistency -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install yyw-code/MallBase admin-theme-consistency --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/yyw-code/MallBase.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.codex/skills/vbenAdmin/admin-theme-consistency .agents/skills/admin-theme-consistency && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "admin-theme-consistency" agent skill from https://github.com/yyw-code/MallBase/tree/main/.codex/skills/vbenAdmin/admin-theme-consistency into .agents/skills/admin-theme-consistency/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "admin-theme-consistency", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add yyw-code/MallBase --skill admin-theme-consistency -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install yyw-code/MallBase admin-theme-consistency --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/yyw-code/MallBase.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.codex/skills/vbenAdmin/admin-theme-consistency .cursor/skills/admin-theme-consistency && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "admin-theme-consistency" agent skill from https://github.com/yyw-code/MallBase/tree/main/.codex/skills/vbenAdmin/admin-theme-consistency into .cursor/skills/admin-theme-consistency/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "admin-theme-consistency", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/yyw-code/MallBase.git --path .codex/skills/vbenAdmin/admin-theme-consistency--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add yyw-code/MallBase --skill admin-theme-consistency -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install yyw-code/MallBase admin-theme-consistency --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/yyw-code/MallBase.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.codex/skills/vbenAdmin/admin-theme-consistency .gemini/skills/admin-theme-consistency && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "admin-theme-consistency" agent skill from https://github.com/yyw-code/MallBase/tree/main/.codex/skills/vbenAdmin/admin-theme-consistency into .gemini/skills/admin-theme-consistency/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "admin-theme-consistency", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install yyw-code/MallBase admin-theme-consistencyInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add yyw-code/MallBase --skill admin-theme-consistency -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/yyw-code/MallBase.git skills-src && mkdir -p .github/skills && cp -r skills-src/.codex/skills/vbenAdmin/admin-theme-consistency .github/skills/admin-theme-consistency && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "admin-theme-consistency" agent skill from https://github.com/yyw-code/MallBase/tree/main/.codex/skills/vbenAdmin/admin-theme-consistency into .github/skills/admin-theme-consistency/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "admin-theme-consistency", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add yyw-code/MallBase --skill admin-theme-consistency -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install yyw-code/MallBase admin-theme-consistency --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/yyw-code/MallBase.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.codex/skills/vbenAdmin/admin-theme-consistency .opencode/skills/admin-theme-consistency && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "admin-theme-consistency" agent skill from https://github.com/yyw-code/MallBase/tree/main/.codex/skills/vbenAdmin/admin-theme-consistency into .opencode/skills/admin-theme-consistency/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "admin-theme-consistency", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
admin-theme-consistency- GitHub stars
- 106
- Token cost
- ~270 tokens
- SKILL.md length
- 62 words
- Files
- 1
- Skills in repo
- 12
- Repo updated
- First seen
- Licence
- MIT
At a glance
MallBase Vben Admin 主题与 Modal 表单一致性规则；开发后台页面、组件样式、弹窗表单或明暗色适配时使用。
- Works in 8 steps: 禁止写死浅色背景（如 #fff、#f5f5f5）作为页面主容器颜色。 → 优先使用主题变量：hsl(var(--background))、hsl(var(-… → 组件样式改动必须同时验证浅色和深色模式，不允许只修一种主题。 → …
- SKILL.md covers 适用范围, 强制规则, 推荐做法 and 自检清单
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
What it does
Admin Theme Consistency is an agent skill from yyw-code/MallBase. MallBase Vben Admin 主题与 Modal 表单一致性规则；开发后台页面、组件样式、弹窗表单或明暗色适配时使用。
Its SKILL.md is about 270 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
The repository describes itself as: MallBase 是一个基于 PHP 的商城型业务基础框架，围绕 用户、商品、订单、权限 四个最核心的商业模块，提供一套清晰、稳定、可扩展的业务结构基线。 它不是一个功能齐全的电商系统，也不是通用 Web 框架，而是一个专注于“商城核心模型”的业务底座，用于快速构建和演进各类商业应用。 The licence is MIT.
Example prompts
- “/admin-theme-consistency”
Workflow steps
8 steps, taken from the first numbered list in SKILL.md.
- 禁止写死浅色背景（如 #fff、#f5f5f5）作为页面主容器颜色。
- 优先使用主题变量：hsl(var(--background))、hsl(var(--card))、hsl(var(--popover))、hsl(var(--border))、hsl(var(--foreground))。
- 组件样式改动必须同时验证浅色和深色模式，不允许只修一种主题。
- 富文本、上传预览、表单校验提示等嵌入式区域必须跟随主题。
- 第三方组件样式通过受控容器 class 或 CSS 变量桥接，不做无边界全局覆盖。
- Modal 表单优先复用同模块、同类型页面的布局；水平或垂直布局应由字段密度、弹窗宽度和响应式需求决定。
- 标签宽度在表单级统一配置，但 100px 不是全局硬编码；仅在相邻实现和字段文案都适合时使用，窄弹窗或长标签应采用响应式配置或垂直布局。
- 表单间距使用项目现有样式体系统一控制，禁止把 pt-4、mt-4 等单一 class 当成所有弹窗的强制模板。
What it can do on your machine
Read from SKILL.md and the folder at commit 3f10589. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
Admin Theme Consistency loads about 270 tokens when it runs. Until then it costs about 22 tokens; SKILL.md has 62 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from yyw-code/MallBase at commit 3f10589, republished under its MIT licence (© yyw-code). 62 words, ~270 tokens.
Download SKILL.mdSave it as
.claude/skills/admin-theme-consistency/SKILL.md (or your agent's skills folder).- name
- admin-theme-consistency
- description
- MallBase Vben Admin 主题与 Modal 表单一致性规则；开发后台页面、组件样式、弹窗表单或明暗色适配时使用。
Vben 规则：后台主题与 Modal 表单一致性
适用范围
frontend/admin/apps/web-antd 后台页面、表单、弹窗、上传与富文本相关 UI。
强制规则
- 禁止写死浅色背景（如
#fff、#f5f5f5）作为页面主容器颜色。 - 优先使用主题变量：
hsl(var(--background))、hsl(var(--card))、hsl(var(--popover))、hsl(var(--border))、hsl(var(--foreground))。 - 组件样式改动必须同时验证浅色和深色模式，不允许只修一种主题。
- 富文本、上传预览、表单校验提示等嵌入式区域必须跟随主题。
- 第三方组件样式通过受控容器 class 或 CSS 变量桥接，不做无边界全局覆盖。
- Modal 表单优先复用同模块、同类型页面的布局；水平或垂直布局应由字段密度、弹窗宽度和响应式需求决定。
- 标签宽度在表单级统一配置，但
100px不是全局硬编码；仅在相邻实现和字段文案都适合时使用，窄弹窗或长标签应采用响应式配置或垂直布局。 - 表单间距使用项目现有样式体系统一控制，禁止把
pt-4、mt-4等单一 class 当成所有弹窗的强制模板。
推荐做法
- 页面容器使用统一语义 class 承接主题变量，避免每页重复写样式。
- 状态色优先走设计系统 token，不自行定义一套颜色。
- 深色模式下，边框优先提升对比度而非提升纯亮度。
- 新增或编辑弹窗先检查同模块现有 Modal，复用其宽度、label 布局、校验提示和按钮顺序。
- 内容可能超出视口时，为 Modal 主体设置受控滚动区域，避免操作按钮被挤出可视范围。
自检清单
- 深色模式下无明显白底区域（页面、卡片、弹窗、上传区、编辑器）。
- 表单输入、错误提示、禁用态在浅色和深色都可读。
- 上传组件（图片/视频/文件）列表与预览区域跟随主题。
- Modal 的布局与同模块页面一致，标签不截断，窄屏下无横向溢出。
- 改动后手动检查受影响页面的浅色、深色和典型弹窗状态。
© yyw-code, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
Just SKILL.md in .codex/skills/vbenAdmin/admin-theme-consistency of yyw-code/MallBase.
Open the folder on GitHubat commit 3f10589
Compare with similar skills
Admin Theme Consistency next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Admin Theme Consistency this skillyyw-code/MallBase | 106 | — | ~270 | Automated safety check: Pass | MIT | |
| Theme Factoryanthropics/skills | 180k | 48 repos | ~781 | Automated safety check: Pass | Apache-2.0 | |
| ModalK-Dense-AI/scientific-agent-skills | 48k | 1 repos | ~4.5k | Automated safety check: Notes | Apache-2.0 | |
| Theme Factorynexu-io/open-design | 100k | — | ~329 | Automated safety check: Pass | Apache-2.0 | |
| Adminyc-software/qm | 15k | — | ~3.1k | Automated safety check: Pass | MIT | |
| Imperative Modal APIlobehub/lobehub | 83k | — | ~1.3k | Automated safety check: Pass | Custom licence |
Similar skills
- Official
Modal
K-Dense-AI/scientific-agent-skills
Modal is a serverless cloud platform for running Python on demand, including on-demand GPUs.
Theme Factory
nexu-io/open-design
Apply professional font and color themes to artifacts including slides, docs, reports, and HTML landing pages.
Admin
yc-software/qm
Act for an org admin — the admin API (scope directory, per-scope config & SOUL, any scope's memory, transcripts & captured prompts, files, user roster & external users, audit/errors/metrics/egress)…
Imperative Modal API
lobehub/lobehub
Shows how to build modals, dialogs and confirmations in LobeHub with the base-ui imperative API (createModal, confirmModal, ModalHost) instead of declarative Modal components.
Modal
davila7/claude-code-templates
Run Python code in the cloud with serverless containers, GPUs, and autoscaling.
More from yyw-code/MallBase
All 12 skills in this repoPayment Notify Idempotency
yyw-code/MallBase
MallBase 支付与退款回调安全规则；修改 backend/route/notify.php、PayNotifyController、NotifyService、WechatPaymentResultService、mbpaymentlog，或处理微信/其它渠道 webhook 的验签、解密、防重放、金额校验、幂等、事务与 HTTP 应答时使用。
Route Permission System
yyw-code/MallBase
MallBase ThinkPHP 后台路由与权限元数据规则；新增或调整 backend/route/api/admin 路由、System 权限码、菜单元数据、/:id 路径参数、共享 permission 或 sync:permissions 同步时使用。
Upload Component First
yyw-code/MallBase
MallBase Vben Admin 上传组件与字段契约规则；实现图片、视频或文件上传，以及处理 FileInfo 回填和提交值时使用。
Architecture Layering
yyw-code/MallBase
MallBase ThinkPHP 后端分层、Swoole Service 无状态与 IDE 泛型规则；开发或重构 backend/app 下的 Controller、Service、Model，调整 BaseController/BaseService、service()/model() 调用、构造注入或协程安全状态时使用。
E2E Webantd Realapi
yyw-code/MallBase
MallBase Vben Admin 局部格式化与真实后端 E2E 收口规则；修改、测试或回归 web-antd 代码时使用。
List Query Sync
yyw-code/MallBase
MallBase ThinkPHP 列表查询与分页返回规则；实现或调整 Service 的 buildListQuery、分页 list/total、动态筛选、关联查询、统计、导出或 compact('total', 'list') 返回时使用。
Questions about Admin Theme Consistency
What does Admin Theme Consistency do?
MallBase Vben Admin 主题与 Modal 表单一致性规则；开发后台页面、组件样式、弹窗表单或明暗色适配时使用。. Admin Theme Consistency is an agent skill from yyw-code/MallBase.
How do I install Admin Theme Consistency in Claude Code?
Run `npx skills add yyw-code/MallBase --skill admin-theme-consistency -a claude-code`. Or copy the skill folder (.codex/skills/vbenAdmin/admin-theme-consistency in yyw-code/MallBase) into .claude/skills/admin-theme-consistency in your project. Claude Code loads it when a task matches its description.
How do I install Admin Theme Consistency in Codex?
Run `npx skills add yyw-code/MallBase --skill admin-theme-consistency -a codex`. Or copy the skill folder (.codex/skills/vbenAdmin/admin-theme-consistency in yyw-code/MallBase) into .agents/skills/admin-theme-consistency in your project. Codex loads it when a task matches its description.
Can I use Admin Theme Consistency in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add yyw-code/MallBase --skill admin-theme-consistency -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/admin-theme-consistency, .gemini/skills/admin-theme-consistency, .github/skills/admin-theme-consistency and .opencode/skills/admin-theme-consistency in your project.
What does Admin Theme Consistency need to run?
SKILL.md names no scripts, command-line tools or credentials: Admin Theme Consistency is instructions for the agent only.
Does Admin Theme Consistency access the network?
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Is Admin Theme Consistency safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does Admin Theme Consistency use?
Admin Theme Consistency is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Admin Theme Consistency use?
About 270 tokens (SKILL.md is roughly 1.1k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
What are the alternatives to Admin Theme Consistency?
Skills that share tags, products or a category with Admin Theme Consistency: Theme Factory (anthropics/skills, 180k stars), Modal (K-Dense-AI/scientific-agent-skills, 48k stars), Theme Factory (nexu-io/open-design, 100k stars) and Admin (yc-software/qm, 15k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Admin Theme Consistency?
yyw-code (a GitHub user) maintains it in yyw-code/MallBase, which has 106 GitHub stars. The repository holds 12 skills in this directory. The repository was last updated on August 3, 2026.
Source: yyw-code/MallBase on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.