【CSS】SVGを擬似要素で使う

test.css

div::before {
    content: "";
	background-image: url("xxx.svg");
    background-size: 50px;
    filter: invert(45%) sepia(85%) saturate(2448%) hue-rotate(163deg) brightness(97%) contrast(103%);
}

• background-image: url() でSVGファイルを指定
• background-size: で大きさを指定
• filter: で色を指定
  https://codepen.io/sosuke/pen/Pjoqqp でカラーコードをfilterで使う値に変換できる