Decide whether a diagram outline should grow with its geometry

Name the visual role of the outline

MDN documents non-scaling-stroke as independent of element transforms. Parallel centerlines 10 units apart, width 2, uniform scale 3. Ordinary width becomes 6 and clearance 30−6=24; non-scaling width stays 2 and clearance 30−2=28. At scale 1, clearance is 8. These are mathematical assertions, not rendered measurements.

Decide whether the line represents a physical boundary, a diagrammatic emphasis or a decorative frame. Those roles can justify different treatment. A product section drawing may need its gap to remain understandable, while a decorative border may intentionally grow with the rest of the mark. The file’s current setting is evidence of implementation, not proof of the designer’s intention.

Choose a simple region where the consequential gap can be described independently of a screenshot. Record the reference endpoints, nominal line width and intended display conditions. Keep the authored geometry unchanged in the comparison so the owner can see whether a proposed solution is altering the outline treatment or actually moving the represented parts.

Use the clearance calculation to expose the tradeoff

The fixture’s table separates centerline distance from the visible space between the strokes. Read both columns before choosing a candidate. Equal endpoints do not imply an equal visual channel, and a passing placement test does not settle this line-weight decision. The arithmetic was executed in Python; the actual receiving application remains a separate observation.

For this invented diagram, ask whether either candidate could lead a reader to misunderstand the channel. The designer should judge the supported viewing size, not a magnified crop alone. If neither treatment communicates the feature clearly, consider a different approved schematic or detail view rather than claiming a numerical setting has solved the communication problem.

Keep a second region with a broad opening in the comparison. It helps distinguish a localized narrow-gap concern from a proposed change to the whole illustration’s hierarchy. A global outline adjustment that improves one tiny feature can make the rest of the drawing look disconnected or inconsistent. The acceptance decision should explain which visual relationships must remain stable.

Inspect the delivered treatment rather than an editing label

Have the implementation owner supply the exact candidate through the intended reuse route. Record the computed style or equivalent receiving evidence alongside the visible result. An attribute written in the source is not the same as proof of the final effective treatment. Avoid layering manual width changes on top of an existing correction until the current behavior has been established.

Compare the line hierarchy, narrow region and outer silhouette at the supported presentation sizes. Keep other effects and positions fixed. If the downstream tool cannot reproduce the proposed treatment, request a supported derivative and document its scope. Do not promise that one SVG setting determines physical print dimensions or behaves identically in every conversion tool.

Ask the creative owner to approve any intentional divergence between placements. A compact icon and a large explanatory diagram can need different designs, but that should be a deliberate derivative decision. Keep the common source available instead of overwriting it with a one-placement compensation that another team may later reuse unknowingly.

Record the choice and the consequence it protects

Retain the geometry, outline candidates, clearance table and accepted receiving evidence. State why the selected treatment serves the reader’s task and where it applies. Do not turn a local design decision into a universal rule that outlines should always remain fixed or always grow. The same mathematical result can be desirable in one illustration and misleading in another.

Rerun the narrow-region comparison when the diagram’s proportions or reuse sizes change. Keep the measured expectation distinct from the designer’s judgment and the actual renderer observation. The finished handoff should explain why the chosen line weight is appropriate, allowing a later producer to revisit the decision without guessing which hidden adjustment made an earlier screenshot look right.

Make the reasoning concrete.

A fictional assembly guide enlarges an SVG diagram for a wall display. Its parts remain correctly positioned, but the outlines compete with a narrow channel that readers must identify.

The guide team makes the line-weight choice explicit and requests actual receiving evidence rather than assuming correct endpoints establish correct appearance.

Take the questions into your next brief.

Use these prompts in your own notes. Nothing is submitted from this page.

1. Role

   What does the outline communicate?

2. Geometry

   Which centerlines and narrow region remain fixed in the comparison?

3. Clearance

   What does each candidate leave visibly open?

4. Placement

   Which presentation sizes and route are covered?

5. Decision

   Why does the selected treatment serve the reader’s task?

Watch for the wrong conclusion.

• Confusing centerline distance with open clearance.
• Stacking compensating adjustments without tracing the effective treatment.
• Claiming universal output behavior from an editor setting.

Sources & scope

Workflows and fictional business examples are original editorial analysis. Source mechanics and their repeated applications are charged. Python mathematical assertions were executed; no browser or 3D renderer test, real asset edit, configuration change or publication is claimed.

• vector-effect →Maintainer-authored web-platform reference; implementation guidance, not a normative standard · Supports: Supports non-scaling stroke behavior.