What problem does it solve? Creating clean, consistent educational diagrams usually requires design tools or manual SVG work; this Skill produces production-quality SVG visuals with a unified flat design system that render identically in any browser with automatic light/dark mode. ## Core Features & Use Cases - Unified Design System: Nine color ramps, fixed typography classes, spacing rules, and arrow markers ensure every diagram shares the same flat, minimal aesthetic. - Eight Diagram Types: Flowcharts, structural containment, API maps, microservice topologies, data flows, physical objects, infrastructure hub-spoke layouts, and UI dashboard mockups. - 15 Tested Examples: Ready-made patterns for chemistry mechanisms, floor plans, aircraft structures, CPU microarchitecture, electricity grids, and narrative journeys. - Use Case: Ask for a diagram of an SN2 reaction mechanism and receive a single standalone HTML file with atoms, curved arrows, and an energy profile that you open directly in a browser — no server or dependencies. ## Quick Start Use the concept-diagrams skill to create an SVG diagram of a wind turbine cross-section and save it as a standalone HTML file.
