svg-authoring

Guide SVG authoring for Visual Brainstorm icons and system maps.

Updated Jul 7, 2026
One-click install
npx skills add https://github.com/MakingThingsWorkToronto/visual-brainstorm --skill svg-authoring-makingthingsworktoronto
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: svg-authoring
Source: https://github.com/MakingThingsWorkToronto/visual-brainstorm/tree/main/.agents/skills/svg-authoring
Command: npx skills add https://github.com/MakingThingsWorkToronto/visual-brainstorm --skill svg-authoring-makingthingsworktoronto

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill simplifies the creation of board-option SVGs for Visual Brainstorm, ensuring high-quality, consistent, and adaptable graphics tailored for user feedback and iteration.

Core Features & Use Cases

  • SVG Authoring Standards: Defines clear rules and guidelines for creating SVGs.
  • Divergence Discipline: Encourages distinct designs by placing options at unique coordinates.
  • Per-kind Recipes: Provides detailed instructions for different SVG board types.
  • Quality Checklist: Assesses SVGs against key criteria for readability and functionality.
  • Use Case: Use this Skill when creating SVG icons or system maps within Visual Brainstorm.

Quick Start

Run 'mcp generate svg-authoring' to generate a board-option SVG that conforms to the SVG authoring standards.

Frequently Asked Questions about svg-authoring

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
What are the SVG authoring guidelines for Visual Brainstorm boards?

SVG authoring for Visual Brainstorm boards requires defining elements with specific rules for viewBox, stroke style, naming conventions, and animated features to ensure style discipline and content coherence.

How do I create consistent SVG system maps and iconography for design iterations?

You can create consistent SVG system maps and iconography by applying per-kind recipes and divergence discipline, placing distinct design options at unique coordinates to encourage variation and facilitate user feedback.

How do I check if my SVG board options meet readability and functionality standards?

You can check SVG board options against a quality checklist that assesses graphics for readability, functionality, and adherence to defined stroke styles, viewBox settings, and naming conventions.

Can I generate an SVG board-option that automatically conforms to specific authoring standards?

Yes, you can generate an SVG board-option that conforms to authoring standards by running a specific generation command that applies predefined rules for viewBox, stroke style, and naming conventions.

What is the best way to manage distinct visual designs when creating multiple SVG options?

The best way to manage distinct visual designs is through divergence discipline, which involves placing design options at unique coordinates to encourage distinct, high-quality, and adaptable graphics.

Do I need specific software to author SVGs for Visual Brainstorm?

Authoring SVGs for Visual Brainstorm requires an environment that supports defining SVG elements with specific rules for viewBox, stroke style, and animated features, without needing external dependencies.