From logo-generator
Generate 25+ programmatic SVG logo variations in a comparison gallery — explore shapes, topologies, palettes. Triggers: "logo shapes" | "svg logo gallery" | "shape exploration" | "dot and line logo" | "logo shape variations".
npx claudepluginhub roxabi/roxabi-plugins --plugin logo-generatorThis skill is limited to using the following tools:
**Goal:** Generate 25+ programmatic SVG logo variations in a single gallery page for quick shape and color exploration.
Designs and iterates on SVG logos via structured interviews for format, style, colors, and sizes. Generates side-by-side previews and PNG exports at standard sizes.
Use when asked to create a logo, design a brand mark, generate a logo concept, or produce any logo asset. Examples: "create a logo for X", "design a brand mark", "make me a logo", "generate logo concepts", "logo for our product".
Generates and edits SVG logos, icons, and graphics. Covers path commands, shape primitives, styling, accessibility, gradients, masks, sprites, optimization, and animation techniques like CSS keyframes and SVG-specific methods.
Share bugs, ideas, or general feedback.
Goal: Generate 25+ programmatic SVG logo variations in a single gallery page for quick shape and color exploration.
Identify target project: $ARGUMENTS name/path → cwd (CLAUDE.md, README.md, package.json, pyproject.toml).
Check brand assets:
charter="$HOME/.roxabi-vault/config/visual-charter.json"
[ -f "$charter" ] && echo "CHARTER_FOUND" && cat "$charter" || echo "NO_CHARTER"
CLAUDE.md, README.md, docs, configs — extract metaphors, shapes, personality.→ DP(C)
Define 6 palettes to rotate across variations. CH exists → its colors as primary palette + 5 complementary alternatives. Otherwise:
const PAL = {
orange: { primary: "#FF6B35", secondary: "#FF8F5E", bg: "#0D0D0D", surface: "#1C1C1E", nameColor: "#FF6B35" },
cyan: { primary: "#06B6D4", secondary: "#67E8F9", bg: "#0A0F1A", surface: "#111827", nameColor: "#67E8F9" },
purple: { primary: "#8B5CF6", secondary: "#C084FC", bg: "#0D0B14", surface: "#1A1625", nameColor: "#C084FC" },
green: { primary: "#4ADE80", secondary: "#22D3EE", bg: "#000000", surface: "#0A0A0A", nameColor: "#4ADE80" },
gold: { primary: "#F59E0B", secondary: "#FBBF24", bg: "#0D0B14", surface: "#1A1625", nameColor: "#FBBF24" },
earth: { primary: "#6B8F71", secondary: "#C4A87C", bg: "#1A1A18", surface: "#252520", nameColor: "#6B8F71" },
};
${CLAUDE_PLUGIN_ROOT}/scripts/svg-gallery-template.html as structural shell.<svg viewBox="0 0 100 110"> (5-15 elements); label + concept description; palette rotation (6 palettes); number badge.SVG helpers: dot(cx,cy,r,fill,opacity)→<circle>; line(x1,y1,x2,y2,stroke,width,opacity)→<line>; connect(nodes,edges,primary,secondary,opts)→batch. Vary one parameter per variation (count/density/rotation/palette/topology). Sections: e.g. "Core Form", "Clusters", "Density Variations", "Rotations", "Symbolic".
<project-root>/brand/svg-gallery.html.xdg-open "<project-root>/brand/svg-gallery.html"→ DP(A) Pick favorites (by number) | New theme | Done
/logo-design for animated production logo, /logo-explore-ai for photorealistic AI render.$ARGUMENTS