Introduction
Understand CircuitMarkdown and how it renders text into SVG schematics.
Core Concepts
CircuitMarkdown operates on five core principles:
Virtual Grid: All component positions and wire routes snap to a grid. One grid unit equals 40 pixels.
Text Representation: Each line of text defines one component, wire, or text label.
Strict Validation: The parser checks component names, pin identifiers, and coordinates. Syntax errors stop rendering and display error markers.
Net-Based Wiring: Wire declarations connect component pins by identifier. The routing engine calculates orthogonal wire paths automatically.
SVG Output: The engine renders schematics as standalone SVG graphics. You can export schematics with transparent backgrounds for light and dark pages.
System Architecture
CircuitMarkdown uses a two-layer architecture:
Core Engine: A TypeScript library that parses DSL text, validates pins, routes Manhattan wires, and generates SVG elements.
Studio Interface: A web application that combines a Monaco code editor with an interactive SVG canvas.
Next Steps
To create a schematic, read the Quick Start Guide.