WorkBuddy Dream Skin Skill
A source-available Agent Skill for designing, generating, injecting, testing, and packaging complete WorkBuddy desktop skins without modifying app.asar.
The skill combines live Console DOM inspection, selector-map generation, scoped theme CSS, native appearance switching, safe CDP injection, visual QA, .wbskin packaging, and standalone one-click bundles.
What it does
- Reads the live WorkBuddy DOM and computed styles through the debugging console.
- Builds a reusable selector map instead of guessing from screenshots alone.
- Generates full light or dark skins with artwork, tokens, controls, menus, dialogs, cards, files, and scrollbars.
- Preserves interaction behavior while styling dynamic React and portal content.
- Handles renderer reloads caused by native appearance switching.
- Packages manager-compatible
.wbskinfiles and verifies that local audit residue is excluded.
Install
Codex on Windows
git clone https://github.com/TimekeeperXY/workbuddy-dream-skin-skill.git "$env:USERPROFILE\.codex\skills\workbuddy-dream-skin"
Restart Codex, then ask:
Use the workbuddy-dream-skin skill to inspect my running WorkBuddy UI and create a complete skin.
OpenClaw
openclaw skills install git:TimekeeperXY/workbuddy-dream-skin-skill@main --global
Other Agent Skills-compatible products
Clone this repository into the product's personal or workspace skills directory. The repository root already contains the required SKILL.md.
git clone https://github.com/TimekeeperXY/workbuddy-dream-skin-skill.git .agents/skills/workbuddy-dream-skin
Quick start
- Prepare visual references and describe the intended light or dark mood.
- Start WorkBuddy with its remote debugging port enabled.
- Ask the Agent to run the skill's DOM audit and selector-map workflow.
- Review the first-pass skin in the real WorkBuddy pages and interactive states.
- Iterate from screenshots, then export
.wbskinand a standalone bundle.
See SKILL.md for the complete workflow and references/field-lessons.md for repair patterns learned from real skin iterations.
Safety
- Does not edit WorkBuddy's
app.asar. - Uses bounded, explicit CDP sessions rather than permanent polling.
- Keeps DOM audits, logs, PID files, and local path records out of distributed packages.
- Requires interaction and restore checks before a skin is considered complete.
Repository layout
SKILL.md Main Agent Skill instructions
agents/ Agent-facing metadata
assets/runtime-template/ Safe theme injection runtime
references/ DOM, safety, QA, and field guidance
scripts/ Audit, generation, launch, and validation tools
License
Copyright © 2026 @晓阳的百宝箱. Personal and non-commercial use only.
Selling, paid distribution, paid bundling, commercial skin-generation services, redistribution, and removal of attribution are prohibited without prior written permission. This repository is source available and is not distributed under an OSI-approved open-source license. See LICENSE.
- Official website: https://timekeeperxy.github.io/workbuddy-skin-gallery/
- GitHub: https://github.com/TimekeeperXY
- Copyright contact: [email protected]
No comments yet
Be the first to share your take.