アニメーション背景のためのメッシュグラデーション ジェネレーター
グラデーション・背景スタジオは、ブラウザ上で動作するグラデーションジェネレーターです。メッシュ、オーロラ、円錐、波、光線など 13 種類のグラデーションから選び、色、グレイン、ガラス、モーションを調整したり、ハーフトーン、ディザ、ASCII、等高線として描き直したりして、背景を仕上げられます。UX Pilot キャンバスに持っていく前に、ランディングページ、カード、モバイル画面といった実際のレイアウトで結果をプレビューできます。
使い方
出発点を選ぶ
ソフトメッシュ、日食の光芒、リソハーフトーンなど 28 のスタイルのいずれかから始めるか、グラデーションの種類と 24 のパレットのいずれかを選びます。
グラデーションを調整する
スケール、ゆがみ、渦巻き、柔らかさを調整し、グレイン、ガラスパネルやガラスタイル、ドット、グリッド、線のオーバーレイ、ブレンドした 2 枚目のレイヤー、ハーフトーンやピクセルソートなどの加工を追加します。アニメーションをオンにして、速度を個別に設定することもできます。
プレビューして使う
ランディングページ、カード、モバイル、新規登録のレイアウトでグラデーションを確認します。その後、無料の UX Pilot アカウントでログインすると、キャンバスで使用したりエクスポートしたりできます。
作れるもの
ランディングページのヒーロー
見出しの邪魔をせず、その背後になじむ、動くメッシュやオーロラの背景。
グレイニーなグラデーション背景
フィルムグレインを加えてサイズを調整し、質感のある印刷物のようなグラデーションに仕上げます。
SNS 用、シェア用の画像
投稿、カバー、シェア画像向けに、1:1、4:5、3:2、16:9、9:16 でグラデーションをフレーミングできます。
アプリやカードのサーフェス
カード、空の状態、モバイル画面に合う、柔らかな放射状、グロー、フロストガラスのスタイル。
よくある質問
メッシュグラデーションとは何ですか？
メッシュグラデーションは、1 本の線に沿ってではなく、面全体で複数の色のポイントをブレンドし、柔らかく有機的な色の面を作ります。このツールでは、メッシュは 13 種類のグラデーションの 1 つで、ほかにフロー、オーロラ、リニア、放射状、円錐、グロー、ブロブ、波、バー、列、光線、軌道があります。
アニメーションするグラデーション背景は作れますか？
はい。アニメーションをオンにして速度を設定します。プレビューはリアルタイムで再生され、グレインもアニメーションさせられます。
グレイニー、ホログラフィック、ハーフトーンのグラデーションは作れますか？
はい。グレインとグレインサイズは標準で備わっており、虹色の雲やオパールといったパレットでホログラフィックな雰囲気を出せます。グレイニーサンセットやプリズムスプリットなどのスタイルが出発点としておすすめです。「加工」セクションでは、どのグラデーションもディザ、ハーフトーン、ASCII、ピクセル、等高線、彫版、クロスハッチ、ピクセルソートとして描き直せます。色はグラデーション自身の色か、2 色のデュオトーンを使います。リソハーフトーン、等高線、ピクセルソートといったスタイルは、これらのエフェクトから始まります。
グラデーションジェネレーターは無料ですか？
試すのは無料で、ブラウザ上で動作します。結果を UX Pilot キャンバスで使用したりエクスポートしたりするには、無料の UX Pilot アカウントが必要です。