brand-pipeline

Original：🇺🇸 English

Translated

Master orchestrator: brand-init → brand-compile → brand-assets. One command to go from zero to full brand system.

2installs

Sourcephrazzld/claude-config

Added on2026-03-01

NPX Install

npx skill4agent add phrazzld/claude-config brand-pipeline

SKILL.md Content

View Translation Comparison →

/brand-pipeline

Full brand system setup in one command.

What This Does

Orchestrates the complete brand-as-code pipeline:

Create
```
brand.yaml
```
(if missing)
Compile to CSS/Tailwind/TypeScript tokens
Generate visual assets (OG cards, social images)

Process

Step 1: Brand Identity

Check for existing brand files:

```
brand.yaml
```
exists → skip to Step 2
```
brand-profile.yaml
```
exists → offer migration via
```
brand-kit migrate
```
Neither exists → run
```
/brand-init
```
interactively

Step 2: Compile Tokens

bash

node ~/Development/brand-kit/dist/src/cli.js compile --out ./src/styles

Verify output:

```
tokens.css
```
— CSS custom properties
```
theme.css
```
— Tailwind 4 @theme
```
tokens.ts
```
— TypeScript export

Step 3: Integrate

Check project setup and wire tokens:

If Tailwind project: verify
```
@import "./theme.css"
```
in CSS entry
If TypeScript: verify tokens.ts is importable
Run typecheck:
```
pnpm typecheck
```
or
```
npx tsc --noEmit
```

Step 4: Generate Assets

Determine needed assets from project context:

Always:
```
og-default
```
If blog exists:
```
og-blog
```
+
```
blog-header
```
If launching:
```
launch-hero
```
+
```
social-announce
```
If changelog:
```
og-changelog
```