グラデーションとは?
グラデーションとは、2色以上の色がなめらかに移り変わる表現のことです。わずかなコードで奥行きとモダンな印象を加えられるため、Webデザインでは背景やボタン、ヘッダーなどによく使われています。
線形グラデーションと円形グラデーションの違い
線形グラデーションは直線に沿って色が変化し、その向きは角度で指定します(0°で上向き、90°で右向き)。円形グラデーションは中心点から円状に広がっていきます。このジェネレーターではどちらも作成でき、対応するCSS(linear-gradient または radial-gradient)を取得できます。
CSSでの使い方
コードをコピーして、要素の background プロパティに貼り付けるだけです。色はいくつでも追加でき、それぞれクリックして編集できます。合わせて使う配色が必要ならカラーパレットも試してみてください。グラデーションの上に文字を置く場合は、事前にコントラストを確認しておきましょう。