1枚のフォトをモザイク表示


今回は、この画像を使って、以下で遊んでみます。



7月も、今日で終わりです。
台風が発生しない7月は、観測史上初めてらしく、それは有難いです。

でも、台風じゃなくても、豪雨で各地に大きな災害があったので、
結果的には、台風が沢山到来したような状態と同じ気がします。




1 モザイク風フォト

この1枚のフォトを、モザイク風にして表示。
とても面白いと思いました。




2 別のフォトに入れ替えて

「1の項目」のフォトを、試しに入れ替えてみますね。

ちゃんと表示できました。




3 同じフォトで、分割部などを変えてみると

今度は、「2の項目」のレイアウトを適当に変えてみました。
どうなるのかな?



出来の良し悪しは別にして、1枚のフォトを色々と変えて表示できるんですね。
ここでのポイントは、CSSでの「display: grid;」と「mix-blend-mode: (値);」の仕組みを勉強することのようです。

※「mix-blend-mode: (値);」の「値」は、次のようなものが使えます。
normal   multiply   screen   overlay   darken   lighten   color-dodge   color-burn   hard-light   soft-light   difference   exclusion   hue   saturation   color   luminosity   initial   inherit   unset

これは沢山あり過ぎて、2・3(1・2ではlighten、3ではhue)しか試してませんが、何だかPhotoshopのレイヤーを重ねる際の効果と同じような気がします。


後でネットで調べたら、Adobe PhotoshopやIllustrator、After Effects、Animateのレイヤーを重ねたときの表示方法の設定と同じだそうです。

ブログ気持玉

クリックして気持ちを伝えよう!

ログインしてクリックすれば、自分のブログへのリンクが付きます。

→ログインへ

なるほど(納得、参考になった、ヘー)
驚いた
面白い
ナイス
ガッツ(がんばれ!)
かわいい

気持玉数 : 118

なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー)
驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた 驚いた
ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス ナイス

この記事へのコメント

  • トトパパ

    こんにちは
    7月も終わりですね。
    台風、8月9月にめちゃめちゃ来そうですね。。。
    モザイク、いいですね。
    2020年07月31日 10:42
  • わけい

    トトパパさんへ
    コメントどうもありがとうございます。

    あと数時間で8月ですね。
    私は台風の定期貯金をした記憶がありませんが、まとめて8・9月に来そうなんですか。
    いやですね。

    モザイク、ありがとうございます。
    2020年07月31日 21:18