Apply style
Skill OneWave-AI/open-agent-stack/plugins/brand-kit/skills/apply-style
Open-source plugins, managed agents, multi-agent orchestrators, and design tokens for Claude Code, the Agent SDK, and any AI tool. By OneWave AI.
npx -y skills add OneWave-AI/open-agent-stack --skill apply-styleAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 1 stars1 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Apply the OneWave design style (tokens + theme) to a frontend project. Trigger when the user asks to brand a site, apply the OneWave look, set up design tokens, theme an app, or fix off-brand colors and typography.
SKILL.md
1.8 KB, as published. Nobody here has run it
Apply OneWave Style
Apply a warm, earth-toned, dark-background design system as tokens and a theme
binding. Keep entry work lean; pull exact values from references/tokens.md and
stack notes from references/stacks.md.
Constraints
- Never emit purple in any color, token, gradient, or preview.
- Never put emoji in UI output; use an icon library reference instead.
- Never invent secrets. This skill needs no API key. If the user provides a live brand URL, read it with the built-in web tool, which needs no configuration.
Workflow
- Detect the stack. Look for
tailwind.config.{js,ts,cjs,mjs}, a global CSS file, and the framework inpackage.json. Record what you find. - Read
references/tokens.mdfor the canonical color, type, spacing, and radius values. Treat that file as the source of truth. - If the user supplied a brand reference URL, read it with the web tool and note any overrides; otherwise use the reference defaults unchanged.
- Write the token block as CSS custom properties on
:rootin the project's global stylesheet. Group by color, typography, spacing, and radius. - Bind the tokens to the stack using
references/stacks.md: extend the Tailwind theme to consume the custom properties, or map plain-CSS utility classes. - Add one preview snippet (a header, a button, and a card) that consumes only the tokens, so the user can verify the look in isolation.
- Scan the result for violations: any purple value or emoji is a failure. Remove and replace before finishing.
- Report the files changed and the next step (adopt tokens across components).