Animated Grid Pattern (グリッドパターンアニメーション)
別名 Flickering grid, Grid background
線や正方形のグリッドで、セルがフェードしたり明滅したりします。
使いどころ
テック系・SaaS のヒーロー
バリエーション
- flickering squares
- animated cells
- interactive grid
- hexagon pattern
- fading squares
- flickering cells
プロンプト
[適用する場所] を使いたい場所に置き換えて、AIエージェントに貼り付けてください。プロンプトにはモーションの名前が入っているので、次からは名前だけで依頼できます。
[適用する場所]にグリッドパターンアニメーション(Animated Grid Pattern)の背景を追加してください。フリッカリンググリッド(flickering grid)、グリッド背景(grid background)とも呼ばれます。
薄い線のグリッドは動かさず、散らばったいくつかのセルがそれぞれ違うタイミングでゆっくりフェードイン・アウトするようにしてください。静かで控えめに、一斉には光らせないでください。
コンテンツの背後に置いてクリックを受け取らないようにし、ユーザーがモーションを減らす設定(prefers-reduced-motion)にしている場合は明滅を止めてください。