DESIGNER TOOL

グラデーションジェネレーター

色・方向を調整しながらグラデーションを確認し、そのまま使えるCSSを生成できます。

グラデーションを作成

135°
0%
100%

使い方

  1. 種類と2色を選びます。
  2. 線形の場合は角度、必要に応じて色の位置を調整します。
  3. 生成されたCSSをコピーします。

グラデーションジェネレーターについて

CSSのlinear-gradient / radial-gradientを視覚的に作成するツールです。すべてブラウザ内で動作します。