無料で利用可能、アカウント不要
CSS 境界半径ジェネレータ
楕円の水平半径と垂直半径を含めて、各コーナーを個別に成形します。結果をプレビューして、コンパクトな CSS をコピーします。
CSS border-radius 値を生成するにはどうすればよいですか?
ピクセルまたはパーセンテージを選択し、各隅の水平方向と垂直方向の半径を調整して、生成された border-radius 宣言をコピーします。 CSS は、要素に適合するように重複する半径を比例的に正規化できます。
よくある質問
CSS border-radius 値を生成するにはどうすればよいですか?
ピクセルまたはパーセンテージを選択し、各隅の水平方向と垂直方向の半径を調整して、生成された border-radius 宣言をコピーします。 CSS は、要素に適合するように重複する半径を比例的に正規化できます。
CSS またはデザインはアップロードされていますか?
いいえ。プレビューと CSS はこのブラウザ タブで生成されます。アップロード、アカウント、API 呼び出し、自動保存はありません。
各コーナーの半径を変えることはできますか?
はい。左上隅、右上隅、右下隅、左下隅の水平方向と垂直方向の値を個別に設定します。
border-radius のスラッシュは何を意味しますか?
水平半径を垂直半径から分離し、楕円形のコーナーを作成します。各コーナーが同じ水平値と垂直値を使用する場合、ジェネレーターはスラッシュを省略します。
プレビューが値よりも小さく見えるのはなぜですか?
CSS は、エッジで重なる半径を比例的に正規化します。これはブラウザの標準的な動作であり、このプレビューにも適用されます。