Brand-in-a-Box: Generating Identity Boards With AI
One-shot identity boards — logo directions, palette, type, mockups — as reference frames you hand to the coding agent for real code.
The blank canvas is where slop is born. Ask an agent to "build a landing page for my startup" with no brand to anchor it and you get the median: purple gradient, Inter, four cards, a logo that's just your company name in semibold. Not because the agent is bad — because you gave it nothing to be faithful to, so it reached for the average. Branding can't emerge from a prompt that contains no brand.
The move is to generate the brand first, as a reference, then hand it to the coding agent. An identity board — logo directions, palette, type pairing, category mockups — gives the agent something concrete to translate instead of inventing. You're not asking for production code in one shot; you're producing the reference frames a designer would make before any code exists, then letting the agent build against them. This post is the brand-in-a-box workflow: generate the identity, then turn it into a real system and real tokens.
Key Takeaways
- A prompt with no brand produces the median brand. Generate the identity as a reference first, then build against it — don't ask the agent to invent and implement in one breath.
- Identity boards are reference frames, not production assets. Logo directions, palette, type, and mockups exist to anchor the coding agent, not to ship as-is.
- One shot gets you directions to choose from. brandkit-identity-boards generates a full board — multiple logo concepts, colors, type, category mockups — in a single pass.
- A board is a starting point; a system is the destination. Turn the chosen direction into a reusable design system with Claude Design's design systems.
- Close the loop into code with tokens. Feed the board's palette to theme-factory so the brand becomes enforceable CSS variables, not a pretty image.
Why the Blank Canvas Defaults
An agent has no opinion about your brand because you haven't given it one. With nothing to anchor on, it falls back to the statistical center of every landing page it's seen — which is exactly the look everyone's tired of. The slop isn't a failure of capability; it's the correct answer to an underspecified question. "Build me a startup site" averages to the median startup site.
An identity board changes the question. Now the agent isn't inventing a brand under time pressure inside a code task — it's translating an explicit one. The taste decisions (this logo direction, this palette, this type) happen before code, in a medium built for exploring them. By the time the agent writes CSS, the brand is decided, and the agent's job shrinks to faithful implementation. Separating "decide the brand" from "build the code" is the whole trick.
Generate the Board in One Shot
brandkit-identity-boards produces a complete identity board from a short brief — what you do, who it's for, the feeling you want. Install it:
npx skills add https://github.com/Leonxlnx/taste-skill --skill brandkit
One pass gives you a board with multiple directions to react to, not a single take you're stuck with:
| Board output | What you get | What it anchors |
|---|---|---|
| Logo directions | 2–4 distinct concepts | The mark and its feel |
| Color palette | Primary, accent, neutrals with roles | Every later color decision |
| Type pairing | Display + body, with scale | Headlines and body voice |
| Category mockups | The brand on real surfaces (card, button, hero) | How it behaves in UI |
| Tone / keywords | The adjectives the brand should read as | The agent's taste brief |
The point of generating several logo directions and a full palette in one shot is choice. You react to options — "this one, warmer" — instead of staring at a blank canvas. That reaction is your taste entering the loop, which is exactly where it belongs. The skill gets you to senior-looking starting points; you pick the direction.
"Generate an identity board for a developer-tools startup that should
feel precise, fast, and a little playful. Give me 3 logo directions,
a full palette with semantic roles, a display + body type pairing,
and mockups of a button, card, and hero."
From Board to Reusable System
A board is a reference, not a system — it shows the brand but doesn't encode the rules for applying it. The next step is turning the chosen direction into a design system the agent can reason about: when to use which color, the component patterns, the spacing logic. Claude Design's design systems does that conversion, taking a board and producing a documented, reusable system.
This is the difference between "here's what the brand looks like" and "here's how to build anything on-brand." The board got the taste decisions made; the system makes them repeatable across every screen you'll ever build. Hand the agent the system, not just the board, and consistency stops being something you re-establish each time.
Close the Loop Into Real Code
The last hop is from system to enforceable tokens. A palette in an image can't stop an agent from inventing a one-off hex — but the same palette as CSS variables can. Feed the board's colors to theme-factory and the brand becomes a token set the agent references instead of approximating:
npx skills add anthropics/skills --skill theme-factory
"Take the palette from the identity board and generate a token system:
full shade ramp, semantic roles, spacing, and type. Output CSS
variables so the brand is enforced in code, not just on a board."
Now the chain is complete: brief to board (brandkit), board to system (Claude Design), system to tokens (theme-factory), tokens to UI (your coding agent reading the variables). The brand you generated in one shot ends up enforced in every component — no median in sight, because the agent was anchored at every step.
Frequently Asked Questions
Is the identity board the final design?
No — it's a reference frame, deliberately. The board exists to anchor the coding agent and to give you directions to choose between, not to ship as production assets. You react to it, pick a direction, then convert it into a system and tokens for real implementation. Treating the board as final is how you'd ship a logo that was never refined; treat it as the starting point it is.
Why generate multiple logo directions instead of one?
Because taste enters the loop through choice. One direction gives you nothing to react against; three give you "this one, but warmer" — which is your judgment steering the result. The skill's job is to produce strong starting points fast; your job is to pick and refine. A single forced take removes the exact step where your taste matters most.
How is this different from just prompting the coding agent?
Sequencing. Prompting the coding agent to invent and implement a brand in one breath produces the median, because it has nothing to be faithful to. Generating the board first separates "decide the brand" from "build the code" — the taste decisions happen in a medium built for them, and the agent's later job shrinks to faithful translation of a brand that's already decided.
Do I need all three skills?
For a one-off, brandkit-identity-boards alone gets you a strong reference to build against. The full chain matters when you want the brand enforced: Claude Design's design systems makes it reusable, and theme-factory makes it enforceable in code. The more screens you'll build, the more the system-and-tokens steps pay off.
Browse brandkit-identity-boards and the rest of the Designs category, or explore the full catalog at aiskill.market.