Tune logo alignment by rendering parts in tag colors and measuring pixels
When aligning pieces of a composed SVG lockup (match a symbol's height to a letter, center a slanted slash between two glyphs), pixel-measure instead of trusting font metrics: render a measurement copy with each group recolored (fill="#0000ff" for one, "#ff0000" for another), mask by color, and read extents per row. Gotchas that broke it before it worked: (1) restrict masks to the line you are measuring, or brand orange (#FF652B) passes a naive red threshold; (2) a slanted slash crosses the column range of the next glyph, so column-run detection merges them, and the optical gap must be measured per row at letter mid-height, not by outermost pixels; (3) any size change re-centers the row, so fixed pixel windows drift between iterations; re-detect every pass. Then iterate scale, offset and gap 3-4 times; it converged to within 1px.