CSS グラデーション ジェネレーター
線形・円形・円錐の CSS グラデーションを視覚的に作成。色の位置、角度、透明度を編集し、CSS をコピーするか PNG で書き出せます。無料。
- アップロードなし
- 制限なし
- 登録不要
カラーストップ
プリセット
- 入力:
- HEX
- 出力:
- PNG
- 実行環境:
- お使いの端末
- サイズ上限:
- なし
- アカウント:
- 不要
CSS グラデーション ジェネレーター の使い方
種類と角度を選ぶ
線形・円形・円錐から選び、角度や形状を設定します。プレビューはすぐに更新されます。
カラーストップを編集
バーの下のハンドルをドラッグし、色と不透明度を選びます。ストップの追加・削除やプリセットからの開始もできます。
CSS をコピー、または PNG で書き出し
CSS（代替の背景色つき）をコピーするか、グラデーションを PNG 画像として保存します。
Toolshed で CSS グラデーション ジェネレーター を使う理由
アップロードなし
すべてこのブラウザのタブ内で処理されます。ファイルが端末の外に出ることはありません。
制限なし
ファイルサイズの上限も、1 日の利用回数の制限もありません。端末が処理できる限り、いくらでも使えます。
登録不要
アカウントもメールアドレスも不要で、透かしも入りません。
よくある質問
グラデーションの種類の違いは？
線形は指定した角度の直線に沿って色が変化し、円形は中心から外側へ広がり、円錐は色相環のように中心の周りを回ります。
代替色とは？
CSS は最初のストップから取った単色の background-color で始まるため、グラデーション非対応の古いブラウザでも適切な色が表示されます。
PNG 書き出しのしくみは？
選んだサイズでブラウザ内の canvas にグラデーションを描画し、PNG として保存します。アップロードはありません。
ファイルはどこかにアップロードされますか？
いいえ。CSS グラデーション ジェネレーター はすべてブラウザ内で動作します。ファイルは端末上で処理され、サーバーに送信されることはありません。
ファイルサイズの上限はありますか？
決まった上限はありません。制限となるのは端末のメモリだけです。非常に大きなファイルは、パソコンのブラウザのほうが快適に動作します。
CSS グラデーション ジェネレーター は本当に無料ですか？
はい。アカウントは不要で、透かしも入りません。各ダウンロードは、短い広告（視聴は任意）か 20 秒の待ち時間で有効になります。このしくみで無料を維持しています。