Brand

Give your AI coding agent a brand — get anything on-brand back. Two agent skills for skills.sh: /make-brand builds a complete, render-safe brand kit for any brand (palette, vendored fonts, outlined logos, backgrounds, mockups, an editorial voice engine, and a brand.json manifest), and /use-brand consumes that kit to render real deliverables — a website, a slide deck, a PDF brand-guidelines book, social & OG cards, marketing copy in the brand voice, dev tokens for your codebase, or a video brief handed off to /make-video.

One contract — brand.json — sits between them. Identity in, anything on-brand out. Works with Claude Code, Cursor, Codex, Windsurf & Gemini — anything skills.sh installs into.

See it work

Examples are generated, not bundled — there are no fake screenshots in this repo. You produce them by running the skills.

Run /make-brand once to mint a kit under brand/<id>/, then point /use-brand at it for each surface you want. Renders go to out/ (gitignored by default); copy keepers into examples/ — see the examples recipes. Everything is a real artifact you can open: self-contained HTML, baked PNG/PDF, a .pptx, a tokens file, or a video brief.json.

Install

npx skills add GoldLegendW80/brand

This copies both skills into your agent.

Use

Two skills, one pipeline. First make a kit, then use it.

Create a brand kit — interactive discovery + a pick-your-direction inspiration board:

/make-brand

Render a deliverable — point it at the kit and say what you want:

/use-brand brand/acme "a landing page"
/use-brand brand/acme "an investor deck"
/use-brand brand/acme "tokens for my Next.js app"
/use-brand brand/acme "a launch tweet thread"
/use-brand brand/acme "an OG image for the homepage"
/use-brand brand/acme "a 30s promo video"

Every surface is themed purely from the kit — palette, vendored fonts, logo lockup, backgrounds, and the brand's signature devices — so the same prompt renders a different look for every brand.

The two skills

Skill	Trigger	What it does
make-brand	/make-brand	Discovery → inspiration board → brand.spec.json → generates the kit: design.md, an editorial/ voice engine, a voice.lock.json, outlined logos, palette-driven static & dynamic backgrounds, device mockups, stickers, a brand board & sheet, and the brand.json manifest. GENERATE from scratch or IMPORT an existing brand from its portal.
use-brand	/use-brand brand/<id> "<what you want>"	Reads brand.json + design.md and renders an on-brand deliverable — web, deck, PDF, social/OG, copy, dev tokens, or a video handoff. Deliverables are self-contained and screenshot/print-ready.

What /use-brand can make

From one kit, any of these — each driven by the kit's palette, fonts, logo, and signature devices:

• Web — a self-contained landing page (inlined fonts/logo/background; opens with zero network).
• Social & OG — share cards and Open Graph images at the right dimensions, baked to PNG.
• Deck — an on-brand slide deck as HTML, with PDF and native .pptx exports.
• PDF / brand guidelines — a printable brand-guidelines book (palette, type, logo usage, voice, dos & don'ts).
• Copy — marketing copy written in the brand's voice (the editorial/ engine is the source of tone).
• Dev tokens — design tokens for your codebase: CSS custom properties, a Tailwind theme, and W3C design-tokens.json.
• Video handoff — a brief.json (with style.design_md wired to the kit) handed to /make-video to render an MP4.

All seven surfaces ship today as generators under skills/use-brand/scripts/ — tokens.mjs, web.mjs, social.mjs, deck.mjs, pdf.mjs, copy.mjs, video-brief.mjs — on top of the shared spine: the kit loader (load-kit.mjs), the preflight (doctor.mjs), and the render-safe template + helper library (assets/_brand.mjs, assets/_bake.mjs). Run doctor.mjs before any creative spend.

What you need

• Node ≥ 20. That's it for HTML, copy, tokens, and the video brief — everything is zero-dependency on top of Node builtins.
• Google Chrome — only for PNG/PDF bakes (and the inspiration-board screenshots in /make-brand). The skills drive your installed Chrome; nothing is downloaded.
• The skill installs its own optional helpers on first use: playwright-core (drives Chrome for bakes) and pptxgenjs (native .pptx decks). No other npm dependencies.

Run the preflight any time: node skills/use-brand/scripts/doctor.mjs (add --bake to also require Chrome + playwright-core).

How it fits together

brand.json is the contract. /make-brand writes it; /use-brand reads it. The kit is normalized into a single brandContext (palette · fonts · logos · backgrounds · mockups · voice · editorial · signature devices) so every deliverable themes itself the same way — no surface hardcodes a hex or a font name; they all pull from CSS variables, so any kit drops in cleanly.

The bundle pairs with llm-video-maker: /use-brand emits a video brief.json with style.design_md pointed at the kit, and /make-video adopts that design verbatim to render the MP4.

Responsible use

You own the marks, claims, and voice in anything you generate. Imported brands' assets carry their own licenses — vendoring them into a kit doesn't relicense them, and rights clearance is on you. The skills track each asset's provenance, but legal and compliance review is yours.

License

MIT — see LICENSE. Generated kits and deliverables (brand/, out/, deliverables/) are gitignored by default; their contents (fonts, imported assets) keep their original licenses.