Support svg fills defined by url

[shellsrods]

Is your feature request related to a problem? Please describe.

I'm getting an error parsing SVG.
The error is specifically related to parsing color
Error: Unable to parse color from string: url(#b-basic-speaker-1d0aff85)

Describe the solution you'd like

Can you support colors defined using pattern definitions and radialGradients?
Sample SVG:

<svg xmlns:v="http://schemas.microsoft.com/visio/2003/SVGExtensions/" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18.146" height="20.462" viewBox="0 0 14.517 16.37" xml:space="default" color-interpolation-filters="sRGB" font-size="12" fill="none" stroke-linecap="square" stroke-miterlimit="3" overflow="visible" fill-rule="evenodd"><title id="title_stencilec25a9ac-e4a2-4f52-a286-3b2368f84bb7">basic-speaker</title>
<defs>
    <radialGradient id="a-basic-speaker" cx="0" cy="0" r="1.4">
        <stop offset="0" stop-color="#00f"></stop>
        <stop offset="1" stop-color="#fff"></stop>
    </radialGradient>
    <radialGradient xlink:href="#a-basic-speaker" id="b-basic-speaker-1d0aff85" cx="-.51" cy="421.029" r="15.186" gradientTransform="scale(.70527 1.4179)" fx="-.51" fy="421.029" gradientUnits="userSpaceOnUse"></radialGradient>
    <radialGradient xlink:href="#a-basic-speaker" id="c-basic-speaker-63ed58ed" cx="-.647" cy="337.33" r="4.901" gradientTransform="scale(.55659 1.79667)" fx="-.647" fy="337.33" gradientUnits="userSpaceOnUse"></radialGradient>
    <radialGradient xlink:href="#a-basic-speaker" id="d-basic-speaker-acaecbc5" cx="-.762" cy="284.478" r="6.699" gradientTransform="scale(.47237 2.11697)" fx="-.762" fy="284.478" gradientUnits="userSpaceOnUse"></radialGradient>
    <radialGradient xlink:href="#a-basic-speaker" id="e-basic-speaker-9c705984" cx="-.863" cy="248.737" r="9.565" gradientTransform="scale(.41735 2.39607)" fx="-.863" fy="248.737" gradientUnits="userSpaceOnUse"></radialGradient>
</defs>
<g transform="translate(.36 -595.99)" v:index="2">
    <path d="M.02 602.34h3.23l3.68-5V612l-3.68-4.83-3.25.01.02-4.84z" fill="url(#b-basic-speaker-1d0aff85)" stroke="#000" stroke-width=".72" stroke-linecap="round" stroke-linejoin="round" transform="translate(0 -.5)"></path>
    <path d="M0 606.92l.76-.49a8.51 8.51 0 0 1 0 5.57l-.76-.44a7.452 7.452-180 0 0 0-4.64z" fill="url(#c-basic-speaker-63ed58ed)" stroke="#000" stroke-width=".72" stroke-linecap="round" stroke-linejoin="round" transform="translate(7.98 -5.043)"></path>
    <path d="M0 603.41l.76-.82a5.355 9.05 0 0 1 0 9.41l-.76-.75a4.143 7.003-180 0 0 0-7.84z" fill="url(#d-basic-speaker-acaecbc5)" stroke="#000" stroke-width=".72" stroke-linecap="round" stroke-linejoin="round" transform="translate(9.966 -3.12)"></path>
    <path d="M0 597.72l.76-1.37a3.51 9.869 0 0 1 0 15.65L0 610.75a2.911 8.185-180 0 0 0-13.03z" fill="url(#e-basic-speaker-9c705984)" stroke="#000" stroke-width=".72" stroke-linecap="round" stroke-linejoin="round" transform="translate(11.665)"></path>
</g>
</svg>

Describe alternatives you've considered

This particular SVG renders correctly in a browser, but not with this library. I'm unsure what alternative solution I should adopt.

Additional context

No response