Draw Technical Diagrams

Produce figures that look drafted, not drawn. The difference is almost never artistic skill — it is that every coordinate was computed by a projection function, every stroke belongs to one deliberate hierarchy, and every label is attached to its part by a leader line.

Hand-typed coordinates are the single largest source of ugly SVG. A human cannot keep parallel edges parallel across forty vertices, so the drawing reads as approximate no matter how carefully it is tweaked. Compute the geometry and the precision is free.

The contract

Seven rules produce the drafted look. Breaking any one is visible immediately.

1. Spatial coordinates are computed, never typed. Anything with depth comes from a projection function. Only flat 2D sections may use literal coordinates.
2. One stroke hierarchy across the whole set: silhouette 1.4, surface 1, detail 0.6. Three weights, reused everywhere.
3. Strokes are declared in device pixels via vector-effect: non-scaling-stroke. Figures are scaled by their container, so hairlines must stay hairlines.
4. Depth is paint order, not opacity. Nearer parts are opaque and painted last. Never fake occlusion with alpha — translucent overlaps are the tell of an amateur figure.
5. Every label is a callout: a leader line with an arrowhead touching the part, and the label aligned to the plate margin so all callouts share one edge.
6. Label text gets a paper-coloured knockout (paint-order: stroke) so leaders and text can cross artwork and stay legible.
7. One hue plus paper. Derive tints with color-mix, never with opacity.

Workflow