generate_brand_kit

Create a complete brand kit with color palettes, typography pairings, and design tokens from company details and aesthetic preferences. Outputs in JSON, CSS, or Tailwind formats with WCAG accessibility scoring.

Instructions

Generate a complete brand kit from a company name, industry, and aesthetic keywords. Returns a color palette with WCAG accessibility scores, curated typography pairings, and design tokens in JSON, CSS, or Tailwind format.

Input Schema

TableJSON Schema

Name	Required	Description	Default
`name`	Yes	Company or brand name
`industry`	No	Industry (e.g., 'fintech', 'healthcare', 'fashion')
`vibe`	No	Aesthetic keywords: 'modern', 'playful', 'luxurious', 'minimal', 'bold', etc.
`format`	No	Output format	full

Implementation Reference

mcp-server/src/index.ts:288-334 (handler)

The "generate_brand_kit" tool is registered in the MCP server, which processes inputs and forwards the request to the "brand-kit" endpoint of the external API via the callToolApi helper.

server.registerTool(
  "generate_brand_kit",
  {
    title: "Brand Kit Generator",
    description:
      "Generate a complete brand kit from a company name, industry, and aesthetic keywords. " +
      "Returns a color palette with WCAG accessibility scores, curated typography pairings, " +
      "and design tokens in JSON, CSS, or Tailwind format.",
    inputSchema: {
      name: z.string().describe("Company or brand name"),
      industry: z
        .string()
        .optional()
        .describe("Industry (e.g., 'fintech', 'healthcare', 'fashion')"),
      vibe: z
        .array(z.string())
        .optional()
        .describe("Aesthetic keywords: 'modern', 'playful', 'luxurious', 'minimal', 'bold', etc."),
      format: z
        .enum(["full", "tokens", "css", "tailwind"])
        .default("full")
        .describe("Output format"),
    },
  },
  async ({ name, industry, vibe, format }) => {
    const result = await callToolApi("brand-kit", { name, industry, vibe, format });
    const data = result as any;
    const r = data.result;

    if (format === "css") {
      return {
        content: [{ type: "text" as const, text: `Brand kit for **${name}**:\n\n\`\`\`css\n${r.css}\n\`\`\`\n\nFonts: ${r.fonts?.display} + ${r.fonts?.body}\nAccessibility: Primary on background ${r.accessibility?.primaryOnBackground?.rating} (${r.accessibility?.primaryOnBackground?.ratio}:1)` }],
      };
    }

    if (format === "tailwind") {
      return {
        content: [{ type: "text" as const, text: `Brand kit for **${name}**:\n\n\`\`\`javascript\n${r.tailwindConfig}\n\`\`\`\n\nFonts: ${r.fonts?.display} + ${r.fonts?.body}` }],
      };
    }

    // Full or tokens format
    return {
      content: [{ type: "text" as const, text: `Brand kit for **${name}**:\n\n\`\`\`json\n${JSON.stringify(r, null, 2).slice(0, 3000)}\n\`\`\`\n\n*(Full result may be truncated — use 'css' or 'tailwind' format for focused output)*` }],
    };
  }
);

agent-toolbelt