2019年09月16日(月)

【ウェブデザイン】CSSブレンドモードで、あなたのウェブサイトにもかっこいいエフェクトを加えましょう！

• 0
• 0
• 0
• 2

ウェブデザイン、特にCSSは、近年意外性のないパターンを進んできました。初めに、ライブラリー以外かその両方の画像に重点を置き、特別効果を作成します。次にCSSでキャパシティーを加えていきます―これで外部リソースへの必要性を大幅に減らしています。ということは、ここで必要になってくる背景にある馬力の大部分は、純粋にブラウザに組み込まれているということです。

CSSブレンドモードは、新たな素晴らしい発見です。前景からも背景からも、色彩豊かな要素をディスプレイする手助けになります。これは、Photoshopブレンドモードと同じような作用です―とても興味深いエフェクトを生み出してくれること間違いなしです。

この記事を投稿する段階で、ブラウザーサポートは100%ではないですが、（マイクロソフトはあまり役に立ちませんでした）デザイナーたちは、すでにブレンドモードで実現できる可能性を追求しています。ここでは、私たちが見つけたエキサイティングな例を紹介していきます。

ブレンドが実現する変化を見る

こちらの便利なデモから始めましょう。各ブレンドモードが背景画像にもたらす効果について、紹介しています。ドロップダウンメニューを使い、複数のモードがどんな風にディスプレイに作用するのか見てみましょう。種類の多さに驚くと思いますよ。