実際のところ
<svg x="0" y="0" height="300" viewBox="0 0 100 100" width="300"
xmlns="http://www.w3.org/2000/svg"
xmlnssvg="http://www.w3.org/2000/svg"
xmlnsxlink="http://www.w3.org/1999/xlink">
<image x="0" y="0" width="100" height="100" href="data:image/png;base64,iVBORw0KGgoAAA..." />
<rect x="0" y="0" width="50" height="50" class="rect rectBlue" />
<rect x="50" y="0" width="50" height="50" class="rect rectPink" />
<rect x="0" y="50" width="50" height="50" class="rect rectGreen" />
<rect x="50" y="50" width="50" height="50" class="rect rectYellow" />
</svg>
この状態でCSSタブ
div.ui-svg svg{
color: var(--nr-dashboard-widgetColor);
fill: currentColor !important;
}
div.ui-svg path {
fill: inherit;
}
.rect {
stroke:black;
stroke-width:1;
}
.rectBlue {
fill:blue;
fill-opacity:0.2;
}
.rectPink {
fill:pink;
fill-opacity:0.2;
}
.rectGreen {
fill:green;
fill-opacity:0.2;
}
.rectYellow {
fill:yellow;
fill-opacity:0.2;
}