CSS円錐グラデーションジェネレーター
CSS グラデーションを視覚的に構築します。ライブ全幅プレビューとコピー可能なコードを使用して、線形、放射状、または円錐タイプ、角度スライダー、最大 6 つのカラー ストップを使用できます。
処理中...
0%
結果
このページでは、すでに選択されている円錐タイプのグラデーション ジェネレーターが開きます。色は、線に沿ってフェードしたり、中心からフェードアウトするのではなく、スライダーで設定した角度から開始して、時計の針のように中心の周りをスイープします。
conic-gradient() は 3 つの CSS グラデーション関数のうちの最新のもので、円グラフ、カラー ホイール、目を引く回転境界線効果をサポートする関数です。停止位置 (パーセント) は円周上の位置です。0% と 100% の 2 つの停止は全周にわたってスムーズにブレンドされ、近くに配置された停止は鮮明なウェッジを作成します。
開始角度を調整し、プレビューが正しく表示されるまで停止し、背景の線をコピーします。最新のブラウザはすべて円錐グラデーションをサポートしているため、コードは安全に出荷できます。