グラデーション → CSSとは？

ビジュアルグラデーションビルダーで、複数のカラーストップを使ったリニア・ラジアル・コニックグラデーションをデザインし、CSSコードをコピーできます。ライブプレビューで角度、位置、色を調整できます。

使い方

1. グラデーションの種類（リニア、ラジアル、コニック）を選択し、方向や角度を設定してください。
2. グラデーションバーをクリックするか、カラーピッカーを使ってカラーストップを追加・削除・調整してください。
3. 生成されたCSSコードをコピーして、スタイルシートに直接貼り付けてください。

結果

サンセットグラデーションを試してみましょう：linear-gradient(135deg, #ff6b35 0%, #f72585 50%, #7209b7 100%)——ヒーローセクションの背景にぴったりです。

関連ツール