CSS backdrop-filter ジェネレーター
背面の要素にエフェクトを簡単に実装できる、backdrop-filterのツールです。
ぼかし・明るさ・コントラスト・グレースケール・色相回転・反転・彩度・セピアなどを複数指定することができます!
2021年1月現在、backdrop-filterはFirefoxとIEでは機能しません。
また、同じくbackdrop-filterのdrop-shadowも「ChromeとEdge」のみでしか機能しない上に、親要素にopacityの1未満(0.9999など)を指定しないと動作しません。
詳しくはCan I Useなどをご確認ください。
CSS backdrop-filter
.original-css-backdropFilter { width: 70%; height: 270px; background-color:rgba(255, 255, 255, 0.2); backdrop-filter: none;}