About

Imported from jeremylongshore/tons-of-skills-marketplace (plugins/design/brand-forge/skills/generate-logo/SKILL.md). Install upstream with npx skills add jeremylongshore/tons-of-skills-marketplace --skill generate-logo. Copyright stays with the author (MIT).

Generate Logo

Name: generate-logo
Author: jeremylongshore

Generates on-brand, editable SVG logo assets — wordmark, monogram, and favicon — from the active brand profile as pure vector output.

Overview

The generate-logo skill turns a saved brand profile into three ready-to-use logo variants that reuse the brand's exact palette and heading font. Output is vector SVG, so every asset scales without loss and needs no account, key, or network call. The generator (lib/logo.mjs) draws each variant deterministically; the skill resolves the active profile, runs that generator, saves the files, and routes them through review. Raster copies are produced only on demand through the /brand-export command.

Prerequisites

An active brand profile created with /brand-new (a brand/ directory, or brands/[slug]/ with a brand/.active pointer). Read loads its color-system.json and typography.json.
Node.js on the PATH — the generator runs as node lib/logo.mjs.
Write access to an output/ directory in the working repository.
Optional: the sharp dependency, only if PNG copies are wanted later.

Instructions

Run /brand-status (or resolveActive in lib/brand.mjs) to confirm which brand is active; if none exists, tell the user to run /brand-new and stop.
Use Glob to locate the active brand directory, then Read and validate the profile with validateProfile. Stop with the offending field if validation fails, for example a non-hex color.
Decide the logo text — the optional text argument, defaulting to the brand name. Ask the user when it is ambiguous.

Generate the three variants by running the deterministic node generator:

import { loadProfile } from '../../lib/brand.mjs';
import { buildLogos } from '../../lib/logo.mjs';
const profile = loadProfile(activeDir);
const { wordmark, monogram, favicon } = buildLogos(profile, { text: 'Northwind' });

Write each variant with the Write tool: output/[slug]-wordmark.svg, output/[slug]-monogram.svg, and output/[slug]-favicon.svg.
Hand the files to the visual-guardian subagent for a palette, contrast, and clear-space pass; apply its fixes or surface its flags.
Report the saved paths and describe each variant. To customize sizing or adapt the geometry, edit the SVG directly or consult the reference below.

Output

Three SVG files under output/, one per variant:

output/northwind-wordmark.svg
output/northwind-monogram.svg
output/northwind-favicon.svg

[slug]-wordmark.svg — the brand name in the heading font with an accent mark (the everyday logo).
[slug]-monogram.svg — one or two initials in a rounded square, for square or tight placements.
[slug]-favicon.svg — a single initial at 64×64 for browser tabs and app icons.

Each file carries role="img" and an aria-label, uses palette colors only, and embeds text that is HTML-escaped before it enters the markup. No PNGs are written unless the user runs /brand-export.

Error Handling

Condition	Behavior
No active brand profile	Stop and direct the user to `/brand-new`; do not invent a palette.
Profile fails `validateProfile`	Report the offending field (non-hex color, missing font family) and stop.
Logo text ambiguous	Ask the user; default to the brand `name` only when unambiguous.
Heading font unavailable at render time	The declared fallback in `typography.json` applies — flag the substitution, never mismatch silently.
`visual-guardian` flags a contrast miss	Apply the fix or surface it; do not ship an asset below the profile's `minContrast`.

To troubleshoot a bad render, verify the profile with /brand-status, then re-run the generator and re-check with the guardian.

Examples

Example — everyday wordmark

/brand-make wordmark logo

Resolves the active brand, builds all three variants, and reports output/northwind-wordmark.svg plus the monogram and favicon.

Example — monogram for an app icon

/brand-make a square monogram for our app icon

Generates the rounded-square monogram from the brand initials and hands it to the guardian for a clear-space check.

Example — validation stop

/brand-make logo

When color-system.json holds an invalid hex, the skill stops at step 2 and reports that field rather than emitting an off-brand asset.

Resources

references/logo-construction.md — variant geometry, clear-space rules, color roles, and accessibility notes the generator applies.
Sibling skills: generate-social for platform posts, and generate-doc-template for letterheads and slides — route between them with the /brand-make command.
SVG on MDN — the vector format every asset is emitted in.
Agent Skills documentation — how skills are authored and invoked.

Use it

Copy one of these into your project. Installing also returns the manifest and these snippets.

yaml

targets:
  - https://api.opensmartroute.ai/api/v1/registry/jeremylongshore-tons-of-skills-marketplace-generate-logo/manifest   # or paste the manifest below

Manifest

An Open Capability Manifest: the router reads it to know what this does, what it costs and when to pick it.

jeremylongshore-tons-of-skills-marketplace-generate-logo.ocm.jsonjson

{
  "ocm": "1",
  "id": "jeremylongshore-tons-of-skills-marketplace-generate-logo",
  "kind": "skill",
  "name": "generate-logo",
  "description": "Generates on-brand, editable SVG logo assets — wordmark, monogram, and favicon — from the active brand profile, reusing its exact palette and heading font. Vector output needs no account, key, or network. Use when a user asks for a logo, wordmark, icon, monogram, or favicon. Trigger with \"make a logo\", \"generate a wordmark\", or \"/brand-make logo\".",
  "publisher": "jeremylongshore",
  "version": "1.0.0",
  "capabilities": {
    "domains": [
      "marketing"
    ],
    "tags": [
      "skill-md",
      "branding",
      "logo",
      "svg",
      "vector",
      "design",
      "skills-sh"
    ],
    "languages": [
      "en"
    ]
  },
  "quality_prior": 0.6,
  "examples": [
    "Generates on-brand, editable SVG logo assets — wordmark, monogram, and favicon — from the active brand profile, reusing its exact palette and heading font. Vector output needs no account, key, or network. Use when a user asks for a logo, wordmark, icon, monogram, or favicon. Trigger with \"make a logo\", \"generate a wordmark\", or \"/brand-make logo\"."
  ],
  "primary": false,
  "metadata": {
    "source": {
      "provider": "skills.sh",
      "repository": "https://github.com/jeremylongshore/tons-of-skills-marketplace",
      "path": "plugins/design/brand-forge/skills/generate-logo/SKILL.md",
      "ref": "HEAD",
      "url": "https://github.com/jeremylongshore/tons-of-skills-marketplace/blob/HEAD/plugins/design/brand-forge/skills/generate-logo/SKILL.md",
      "key": "jeremylongshore/tons-of-skills-marketplace/plugins/design/brand-forge/skills/generate-logo/SKILL.md"
    },
    "compatibility": "Designed for Claude Code",
    "allowed_tools": [
      "Read,",
      "Write,",
      "Glob,",
      "Bash(node:*)"
    ],
    "license": "MIT"
  },
  "instructions": "# Generate Logo\n\nGenerates on-brand, editable SVG logo assets — wordmark, monogram, and favicon — from the active brand profile as pure vector output.\n\n## Overview\n\nThe generate-logo skill turns a saved brand profile into three ready-to-use logo\nvariants that reuse the brand's exact palette and heading font. Output is vector SVG,\nso every asset scales without loss and needs no account, key, or network call. The\ngenerator (`lib/logo.mjs`) draws each variant deterministically; the skill resolves\nthe active profile, runs that generator, saves the files, and routes them through\nreview. Raster copi",
  "cost": {
    "context_tokens": 1220
  }
}

Fetch it by URL: GET /api/v1/registry/jeremylongshore-tons-of-skills-marketplace-generate-logo/manifest?version=1.0.0

Reviews

Star ratings from people who tried it. One review per account; edit yours any time.

No reviews yet. Install it, try it, and be the first to rate it.