backgroundでSVGを利用して色を弄る

SVGをbackgroundで使って色を自由にいじる方法。

1. SVGのコードをUTF8でパーセントエンコーディングする。
ツール：https://tech-unlimited.com/urlencode.html

2.次のようにbackground-imageに指定する。

background-image: url(data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D～略～fill%3D%22%23FFFFFF%22%);

3.「fill=”#FFFFFF“」に相当する部分、FFFFFFがカラーコードなのでここを自由に変更する。