# Power Apps Code Apps (Power CAT)

> Has your agent turn your brand's stylesheet, guidelines, website or logo into a design guide and CSS tokens for a Power Apps code app.

Microsoft Power CAT's plugin for styling Power Apps code apps in your own brand instead of the default template look. Its one skill, code-apps-design-guide, reads the brand assets you give it, writes a design guide and a design tokens file, then hands off to Microsoft's code-apps plugin to build the app with them. The plugin is in preview.

What it does
- Asks for your brand name, your brand assets and whether the app is for web, mobile or both
- Pulls colours, typography, spacing, radii, shadows and layout patterns from a CSS stylesheet, a PDF or Word brand guide, a website or a logo; with no assets, it suggests a palette from words you use to describe your brand
- Writes design-guide.md: colour palette (with contrast ratios when your guidelines set WCAG levels), type scale, logo usage, spacing, grid, breakpoints, components and information architecture
- Writes design-tokens.css with CSS custom properties for colours, type, spacing, radii and shadows
- Checks the palette, fonts and spacing with you and changes them until they're right
- Applies the tokens to a new or existing code app, adds a note to .github/copilot-instructions.md so later work follows the guide, and runs npm run build to check nothing broke

How to install it
In Claude Code, run /plugin marketplace add microsoft/power-cat-skills, then /plugin install powercat-code-apps@power-cat-skills. Power CAT also documents GitHub Copilot CLI and Microsoft Scout. To build the app itself, add Microsoft's code-apps-preview plugin from the microsoft/power-platform-skills marketplace, which provides /create-code-app.

Good to know
- It doesn't scaffold, deploy or connect data sources itself: the code-apps plugin does that, with npx power-apps init and npx power-apps push.
- You can use it for just the design guide and tokens, without creating an app.
- The skill's own install prompt still calls the companion plugin code-apps; Microsoft's marketplace now lists it as code-apps-preview.

- Type: Plugin
- Made by: Microsoft
- Category: Design
- Formats: Claude plugins
- Version: 1.0.0
- Website: https://github.com/microsoft/power-cat-skills/tree/main/plugins/powercat-code-apps
- Source: https://github.com/microsoft/power-cat-skills/tree/HEAD/plugins/powercat-code-apps
- Page: https://pluginboard.ai/plugins/powercat-code-apps

## Works with

- Claude
- GitHub Copilot
- Claude Code
- OpenClaw

## Install

### Claude

In Claude (web or desktop): Customize → Plugins → Add → Add marketplace, enter microsoft/power-cat-skills, then add powercat-code-apps

### Claude Code

In Claude Code:

```text
/plugin marketplace add microsoft/power-cat-skills
/plugin install powercat-code-apps@power-cat-skills
```

---
From Pluginboard (https://pluginboard.ai).