hirokonaBlog

ググる→忘れそう→即時メモ 京都のWebデザイナーの備忘録

cssでブレンドモード

ふつーには実装できなかった乗算かかってるデザインとか。

filterとかでなんとかなるかなって調べてたけどIE以外ならmix-blend-modeでいけそう。
最初調べた時background-blend-modeの記事しか見て無くてうっかり見過ごしそうになった。。。

乗算とかかけたい要素自体にmix-blend-modeを設定する。

mix-blend-mode – CSS | MDN
https://developer.mozilla.org/ja/docs/Web/CSS/mix-blend-mode

background blend mode とは別物。
CSSブレンドモードで画像を彩ろう | Webクリエイターボックス

CSSブレンドモードで画像を彩ろう

事例
WORKS | school|Visual&Interactive Production
http://schl.co.jp/works/


投稿日

カテゴリー:

投稿者:

タグ:

コメント

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください