2022年07月14日(木)

CSSだけでスクロールに合わせて動くホログラムっぽいやつ

• 0
• 0
• 1
• 4

Result

See the Pen
Untitled by kachibito (@kachibito)
on CodePen.

角度を変えたり等、動かす事でキラキラする、いわゆるホログラムっぽいものをCSSだけで作ろう、というもの。

ビックリマンチョコのシールみたいなのです。氷河期世代以外でも分かるよね・・

種明かしするまでもないかもですがlinear-gradientとmix-blend-mode、background-attachment: fixed;などで実装されています。

詳しい解説は以下で確認できます。コードはCodepenか下記参考URLにてご参照ください。

via

Holograms, light-leaks and how to build CSS-only shaders.