# Design System Agent

> Create a source-backed design-system brief and walk an operator through using Claude.ai/design or Codex design workflows to generate, review, export, and import a brand kit/design system into the GTM Brain.

- **Type:** Skill
- **Install:** `agentstack add skill-andytoizer-gtm-brain-builder-design-system-agent`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [Andytoizer](https://agentstack.voostack.com/s/andytoizer)
- **Installs:** 0
- **Category:** [Agent Skills](https://agentstack.voostack.com/c/agent-skills)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [Andytoizer](https://github.com/Andytoizer)
- **Source:** https://github.com/Andytoizer/gtm-brain-builder/tree/main/skills/design-system-agent

## Install

```sh
agentstack add skill-andytoizer-gtm-brain-builder-design-system-agent
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# Design System Agent

Use this when the operator wants help creating a design system, preparing the right prompt/brief for a design tool, or importing design outputs into the GTM Brain.

Owns `brand/design-system-brief.md`, the visual-system parts of `brand/brandkit.md`, and design project notes in `brand/design-resources.md`.

## Inputs

- `company/product-truth.md`
- `company/approved-claims.md`
- `icp/`
- `messaging/`
- `customers/proof-approval.md`
- `brand/brandkit.md`
- `brand/design-resources.md`
- `brand/voice-system.md`
- Existing website, app screenshots, logo files, decks, Figma, Canva, social posts, and public docs
- Operator/accountable-owner taste review

## Outputs

- `brand/design-system-brief.md`
- Updated `brand/brandkit.md`
- Updated `brand/design-resources.md`
- Optional implementation notes for Codex when the design system needs to become code, components, CSS tokens, slides, or website assets

## Walkthrough

1. Read the smallest source-backed context needed for the design decision.
2. Ask the operator what they are trying to make: brand kit, design system, deck style, landing page direction, social templates, component library, or coded UI.
3. Build a design-system brief before generation:
   - audience and category
   - desired perception
   - brand personality and tone boundaries
   - product truths and approved claims
   - proof constraints and do-not-claim rules
   - visual references and anti-references
   - required outputs
   - review checklist
4. If using Claude.ai/design, tell the operator to open `https://claude.ai/design`, create a brand-kit or design-system project, paste the brief, and upload only approved assets.
5. If using Codex to implement or import the design system, convert the approved design brief into implementation instructions: tokens, typography, component rules, asset paths, responsive behavior, accessibility notes, and files to update.
6. Review generated output with Grill-me before treating it as durable taste.
7. Import approved decisions:
   - `brand/brandkit.md`: stable visual rules, tokens, typography, logo usage, layout rules, examples, and do/don't guidance
   - `brand/design-resources.md`: project links, prompts, uploaded inputs, exports, asset locations, and owner review state
   - `brand/voice-system.md`: only the voice implications, not visual rules
   - implementation notes: where Codex should apply tokens/components when building downstream assets

## Design Brief Template

```text
Goal:
Audience:
Category/context:
Desired perception:
Brand personality:
Tone boundaries:
Approved claims:
Proof constraints:
Do not claim:
Existing visual assets:
Visual references:
Anti-references:
Required outputs:
Accessibility constraints:
Review criteria:
Import targets:
```

## Rules

- Do not generate brand direction from vibes alone; ground the brief in the GTM Brain.
- Do not let design tools invent positioning, product capabilities, proof, metrics, customer permissions, or customer logos.
- Separate visual system from speaker voice and buyer language.
- Generated designs are drafts until an accountable owner approves them.
- Store the prompt and export links so future agents can understand where the design system came from.
- Ask one Grill-me question before approving durable taste decisions.

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [Andytoizer](https://github.com/Andytoizer)
- **Source:** [Andytoizer/gtm-brain-builder](https://github.com/Andytoizer/gtm-brain-builder)
- **License:** MIT

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-andytoizer-gtm-brain-builder-design-system-agent
- Seller: https://agentstack.voostack.com/s/andytoizer
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.
