brand-pipeline
SKILL.md
/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.yamlexists → skip to Step 2brand-profile.yamlexists → offer migration viabrand-kit migrate- Neither exists → run
/brand-initinteractively
Step 2: Compile Tokens
node ~/Development/brand-kit/dist/src/cli.js compile --out ./src/styles
Verify output:
tokens.css— CSS custom propertiestheme.css— Tailwind 4 @themetokens.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 typecheckornpx 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
node ~/Development/brand-kit/dist/src/cli.js render og-default \
--title "[Brand Name]" --subtitle "[Tagline]" --out ./public/og.png
Step 5: Summary
Report what was created:
- brand.yaml location
- Token output files
- Generated assets
- Integration status
Flags
--skip-init— Skip brand-init, require existing brand.yaml--skip-assets— Only compile tokens, skip asset generation--out <dir>— Override token output directory
Related Skills
/brand-init— Interactive brand discovery/brand-compile— Token compilation/brand-assets— Asset generation/launch-assets— Full launch package (uses brand-pipeline internally)
Weekly Installs
8
Repository
phrazzld/claude-configGitHub Stars
5
First Seen
Feb 27, 2026
Security Audits
Installed on
opencode8
gemini-cli8
codebuddy8
github-copilot8
codex8
kimi-cli8