すべてのスクリーンテストツールグラデーションテスト
グラデーション画像ジェネレーター
2 色または 3 色の線形・放射状グラデーションを作成します。角度と画像サイズを調整し、背景画像のダウンロードやウェブサイト用 CSS のコピーができます。
- 線形・放射状グラデーション
- 画像ダウンロードと CSS
ライブプレビュー
1920 × 1080 pxプレビューは表示領域に合わせて縮小されます。ダウンロード画像は上記のピクセル寸法で作成されます。
background: linear-gradient(90deg, #2563eb, #e879f9);ブラウザーによる色補間の違いにより、CSS と PNG の表示がわずかに異なる場合があります。
使い方
- 画像の寸法を設定し、線形または放射状グラデーションを選びます。
- 開始色と終了色を選び、必要に応じて中間色を追加し、線形の場合は角度を調整します。
- PNG や JPEG をダウンロードするか、CSS の背景指定をコピーします。
使用条件と制限
装飾用のグラデーション背景を作成します。縞模様の検査には別のグラデーションテストを使ってください。生成画像から画面のビット深度や色精度を証明することはできません。
よくある質問
グラデーションの角度は何を表しますか？
CSS と同じ規則で、0° は下から上、90° は左から右、180° は上から下に進みます。放射状グラデーションは中央から始まります。
画像と CSS は完全に同じ見た目になりますか？
色と方向は同じですが、ブラウザーの色補間や画像の拡大縮小によって小さな違いが生じる場合があります。固定されたピクセルの結果が必要な場合はダウンロード画像を使ってください。