# Theme Pack Authoring

Build, validate, and install Kiro Crew theme packs -- pack anatomy, the 60-variable...

- Repository: https://github.com/kirodotdev/KiroCrew (4711 stars)
- Category: Design
- License: Apache-2.0
- Last updated: 2026-11-01
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add kirodotdev/KiroCrew --skill theme-pack-authoring -g -a claude-code -y`
Codex: `npx skills add kirodotdev/KiroCrew --skill theme-pack-authoring -g -a codex -y`
Cursor: `npx skills add kirodotdev/KiroCrew --skill theme-pack-authoring -g -a cursor -y`
Gemini CLI: `npx skills add kirodotdev/KiroCrew --skill theme-pack-authoring -g -a gemini-cli -y`

## Description

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.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Kiro Crew theme-pack authoring

House rules for building theme packs. The authoritative contract is
[`website/docs/theming-contract.md`](https://github.com/kirodotdev/KiroCrew/blob/main/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

```json
{
  "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" }
  ]
}
```

The rest: https://github.com/kirodotdev/KiroCrew/blob/HEAD/src/kiro_crew/builtin_skills/theme-pack-authoring/SKILL.md