モダンな雰囲気からスタイリッシュな雰囲気まで、幅広い演出をしてくれるハーフトーン。今まで画像としてWebサイトに取り込むことが多かったのではないでしょうか。今回ご紹介する「Pure CSS Halftone Effect」ではWebならではの動きを楽しむことができるエフェクトを通したハーフトーンになります。

美しい動きで視線を惹き付ける、ぜひ取り入れてみたいエフェクトとなっています。

詳しくは以下

青赤黄の玉が集合することで本来の画像の形をとっていき、最終的にスタイリッシュなハーフトーンのモナリザになります。集合しきると今度は巻き戻すかのように最初の形へと変化。これをループする動きとなっています。どのブラウザで動くのかどうかなども検証されており、ABCで評価。検証機もWindows、Mac、iPhoneで行われているので、デベロッパーが取り入れる際に親切な設計となっています。

スタイリッシュなハーフトーンを取り入れる際は、動きも一緒に取り入れてみてはいかがでしょうか。

Pure CSS Halftone Effect