前日まで表示されていたSVGが突然表示されなくなったので調査。
実機による再現性↓
・Windows/Chrome →表示されない
・Android/Chrome →表示されない
・iPhone/Safari →表示される
というわけで、Chromeを疑う。
で、google検索した結果↓
https://stackoverflow.com/questions/54453987/did-chrome-72-break-dataimage-svgxmlutf8-for-css-background-svgs
どうやらChrome72から<svg></svg>内に「#」があるとエラーになる模様。
「#」を「%23」に置き換えて対応。
色の設定で頻繁に使用するのに、いきなりこんな仕様変更は困る…。