SOLVED thanks to a previous forum post regarding using MultiEffect on Image{} type component
All that's required is to set VectorImage's visible to false, since the compositor seems to be double rendering, I suppose, creating the unwanted outline of the SVG
Thanks to 6.5 article: https://forum.qt.io/topic/144070/qt6-color-svg-using-multieffect/3
and member: https://forum.qt.io/user/mzimmers
New graphics:
3f636858-1079-499b-9803-afcd8b926c3c-image.png
WORKING CODE:
Item {
id: root
color: <input from higher level>
source: <input from higher>
VectorImage {
id: mySVG
~~~~ same lines from above ~~~~~
visible: false <======== DONT FORGET THIS
}
MultiEffect {
id: colorOverlay
source: mySVG
anchors.fill: mySVG
colorization: 1.0 // opacity equivalent
colorizationColor: root.color
}
}