グラデーション壁紙・背景画像ジェネレーター
スマホやPCの壁紙、スライドの背景に使えるグラデーション画像を、解像度を指定して作成できます。CSSのコードが欲しい場合はCSSグラデーションジェネレーター、単色のダミー画像はダミー画像生成をご利用ください。
🔒 ブラウザ内で完結・入力データはサーバーに送信されません
放射では角度は使いません
解像度のプリセット
プレビュー
使い方
- 「グラデーションの種類」と「色の数」を選び、各色と位置を調整します。
- 「解像度のプリセット」から選ぶか、幅と高さを直接入力します。
- 必要なら「ノイズ（粒状感）」を上げ、形式を選びます。
- 「ダウンロード」を押すと、指定した解像度の画像が保存されます。
注意事項
- 幅・高さは16〜8192pxで、幅×高さは約1677万ピクセル（4Kは約830万）までです。ブラウザのCanvas上限を避けるための制限です。
- プレビューは縮小表示です。ダウンロード時に指定した解像度で描き直します。
- 帯状の段差（バンディング）が気になる場合は、ノイズを少し加えると目立ちにくくなります。
- JPEGは透過に対応せず、グラデーション画像ではPNGより軽くなることが多い一方、わずかに劣化します。
用語解説
バンディング
なめらかなはずのグラデーションに、色の段差が縞状に見える現象です。ごく小さなノイズを加えると目立たなくなります。
円錐グラデーション
中心を軸に、角度に沿って色が一周するグラデーションです。CSSのconic-gradientと同じ考え方で、色相環のような表現に向きます。
よくある質問
作れる画像の解像度に上限はありますか？
幅・高さは16〜8192pxで、幅×高さは約1677万ピクセルまでです。4K（3840×2160）は問題なく作れます。これを超えるとブラウザのCanvas上限で失敗することがあるため、あらかじめ制限しています。
グラデーションに縞（バンディング）が出るのはなぜですか？
8bitの色では、近い色の間の変化が段差として見えることがあります。「ノイズ（粒状感）」を5〜20程度加えると、段差が目立たなくなります。
PNGとJPEGはどちらで保存すべきですか？
劣化なく保存したい場合はPNG、ファイルサイズを小さくしたい場合はJPEGが向きます。ノイズを加えるとPNGは大きくなりやすいので、その場合はJPEGも検討してください。
CSSグラデーションジェネレーターとの違いは何ですか？
CSSグラデーションジェネレーターはCSSのコードを出力します。このツールは、解像度を指定した画像ファイル（壁紙・背景素材）を出力します。
このページをシェア