
Theme Pack Authoring
Build, validate, and install Kiro Crew theme packs -- pack anatomy, the 60-variable...
Install
npx skills add kirodotdev/KiroCrew --skill theme-pack-authoring -g -a claude-code -y- Repository
- kirodotdev/KiroCrew4.7k
- Category
- Design
- Updated
- 3d ago
- License
- Apache-2.0
- Context cost
- Mediumabout 2,927 tokens
- Runs scripts
- No, instructions only
What it does
Build, validate, and install Kiro Crew theme packs -- pack anatomy, the 60-variable palette, role-tagged fonts, the overrides.css allowlist (what installs vs what actually renders), and the install-verify cycle. Use when the user wants to create or edit a theme pack.
Kiro Crew theme-pack authoring
House rules for building theme packs. The authoritative contract is
website/docs/theming-contract.md;
this skill is the self-contained task-oriented digest, plus the traps that cost
real debugging time.
Pack anatomy
my-theme/
├── theme.json # manifest: slug, name, emoji, level, formatVersion, fonts[]
├── variables.json # dark + light palettes (60 allowlisted CSS vars)
├── readme.md # optional; attribution and notes
├── styles/
│ ├── overrides.css # optional; scoped structural CSS (see allowlist below)
│ └── fonts/ # .woff2 / .ttf files, max 6 faces, 512 KB each
└── LICENSE.txt # validates as meta, is NOT copied into the install
Levels: 0 = colors only. 1 = + fonts, branding, overrides.css. 2 = + overlays/topbar/audio/persona. Declare the lowest level that covers the payload, a level-0 pack shipping a font is refused.
theme.json, complete working example
{
"slug": "my-theme",
"name": "My Theme",
"emoji": "🎨",
"level": 1,
"formatVersion": 1,
"loaderIcons": ["star", "sparkles", "moon", "cloud"],
"fonts": [
{ "family": "My Sans", "file": "my-sans-400.woff2", "weight": 400, "role": "sans" },
{ "family": "My Sans", "file": "my-sans-500.woff2", "weight": 500, "role": "sans" },
{ "family": "My Sans", "file": "my-sans-600.woff2", "weight": 600, "role": "sans" },
{ "family": "My Mono", "file": "my-mono-400.woff2", "weight": 400, "role": "mono" }
]
}


