CSS グラデーション生成

使い方

1. ページを開いた時点ですでにグラデーションが表示されています。最初の結果にクリックは不要です。
2. 種類を選びます。「線形」は角度に沿って進み、「放射状」は円から広がり、「円錐」は中心の周りを回ります。線形と円錐ではスライダーで角度を変更できます。
3. スウォッチで色を設定し、それぞれの位置（0〜100%）をドラッグします。多色のグラデーションが必要な場合は「+ 色を追加」で色を増やし、2つまで減らすこともできます。
4. CSS は下でライブ更新されます。ワンクリックでコピーし、CSS を受け付ける任意の場所に貼り付けてください。

範囲、制限、よくある質問

• 不透明な色のみです。スウォッチはブラウザのカラーピッカーで、アルファは表示されません。透明度が必要な場合は、先に色をアルファ付きの形式に変換してから戻ってきてください。
• 標準的な1セグメントのみです。線形、放射状、円錐に対応し、-webkit- 接頭辞、レイヤー化や複数背景のトリック、放射状のサイズ指定や中心位置指定はありません。
• ストップは追加した順序を保ちます。自動並べ替えは行われないため、順序が逆の位置を指定すると意図的にハードな切り替わりになります。
• ストップは2〜8個です。1個に減らすと、偽のグラデーションを作るのではなく、通知とともにグラデーションが停止します。
• プリセットライブラリ、ページ全体の背景への適用、グラデーションを保持する共有リンクはありません。共有ボタンはページ URL のみを共有し、何もアップロード、保存、URL への書き込みは行いません。
• 角度は放射状グラデーションでは意味がないため、角度コントロールは非表示になり、生成されるコードにも角度は含まれません。