CSS グラデーション ジェネレーター
この無料のオンラインツールで美しいCSSグラデーションを簡単に作成できます。線形および放射状のグラデーション、複数のカラーストップ、および角度調整をサポートします。
CSS グラデーション ジェネレーター
この無料のオンラインツールで美しいCSSグラデーションを簡単に作成できます。線形および放射状のグラデーション、複数のカラーストップ、および角度調整をサポートします。
CSS グラデーションについて
標準の background 宣言を出力
線形グラデーションは選択した角度を度数で使い、放射状グラデーションは circle または ellipse の形状を使います。コピーされる結果は、スタイルシートへ貼り付けられる 1 つの background 宣言です。
カラーストップは位置順に並ぶ
複数のカラーストップを追加し、それぞれの色と 0 から 100 percent の位置を設定できます。生成される CSS は stop を位置順に並べてから結合するため、グラデーション宣言が予測しやすくなります。
よくある質問
このテーマに関するよくある疑問と回答をまとめました。
どのグラデーションタイプに対応していますか？
線形と放射状のグラデーションに対応しており、角度、形状、カラーストップの位置を完全に制御できます。
複数のカラーストップを追加できますか？
はい、カスタマイズ可能な位置で必要な数だけカラーストップを追加して、複雑なグラデーション効果を作成できます。
クロスブラウザ対応のコードを生成しますか？
はい、すべてのモダンブラウザで動作する標準的な CSS グラデーション構文を出力します。
データはサーバーに送信されますか？
いいえ、グラデーションCSSの生成はすべてブラウザ内で完結します。色の選択や設定はローカルで処理され、サーバーに送信されることはありません。