svg
を色変えたりしたい場合、img
タグの読み込みではfill
設定できないのでsvg
をコードで埋め込んでfill
の値を変えて色を変える…とかやってきたけど、いまはIEを気にしないでよいのであればimg
タグで読み込んだ上でmask-image
でできるじゃん、というツイートを最近見て、あああたしかに!!となり。
background-color
に色を指定して、mask-image
でsvg
を読み込めばsvg
に色がつく(=実際はsvgのかたちで切り抜いていて、実質そういうふうに見える)