ロゴ画像についてた白背景を透過方法
![](https://colorfulblog.net/wp-content/themes/cocoon-master/images/man.png)
ロゴの背景がHP画像に載せるとき加工するのが手間です~
![](https://colorfulblog.net/wp-content/themes/cocoon-master/images/b-man.png)
かんたんに設定する方法ないですか?
![](https://colorfulblog.net/wp-content/uploads/2020/09/nigaoemaker.png)
CSS設定をしてみてください^^
![](https://colorfulblog.net/wp-content/uploads/2020/09/nigaoemaker.png)
CSS設定するだけでロゴを加工しなくても変更できるのでとても便利ですね
背景画像いれるのは普通にイメージを入れてください。
<div class="logo"><img /></div>
CSS設定はこちら
【背景画像を透明にする】
.logo{
mix-blend-mode: multiply
}
【白透過させる】
.logo{
mix-blend-mode: soft-light
}
【黒だけ透過させる】
.logo {
mix-blend-mode: screen
}
【黒透過させる】
.logo{
mix-blend-mode: exclusion
}
【オーバーレイさせる】
.logo{
mix-blend-mode: overlay
}
ロゴ画像についてた白背景を消すCSSコード pic.twitter.com/CyA51IEvTF
— 小林|Webクリエイター (@pulpxstyle) November 20, 2020
![](https://colorfulblog.net/wp-content/uploads/2020/09/nigaoemaker.png)
メモで残しておきますね^^ありがとうございます。