<svg class="defs-only"> <filter id="duotone" color-interpolation-filters="sRGB" x="0" y="0" height="100%" width="100%"> <feColorMatrix type="matrix" values="0.90 0 0 0 0.40 0.95 0 0 0 -0.10 -0.20 0 0 0 0.65 0 0 0 1 0" /> </filter> </svg>
SVG is a horrible way to do graphics, and not a good vector format due to its complexity. It's also difficult to get good performance, you'll eventually end up implementing stuff at a lower layer when SVG itself becomes a bottle-neck, and it has tons of cross-platform bugs that require endless debugging.
The crux of the matter is vectors are drawings, and may or may not have a hierarchical representation. It would be a lot better abstracted by a real language, using a primitive drawing API that allows you set debugger statements and the like to inspect state, variables, etc.