ブラウザで処理されます
おすすめツールAI Coding Assistant
GitHub Copilot
AI pair programmer that helps you write code faster with smart suggestions.
概要 CSSボーダー半径生成器?
CSS border-radiusプロパティをビジュアルで編集するツールです。各角の半径を個別に操作して、シンプルな均一丸角から高度な非対称値まで、クリエイティブなUI要素のための複雑な形状を作成できます。
使い方
- 各角のハンドルをドラッグして半径を個別に調整してください
- リンクトグルですべての角に同じ半径を一括適用してください
- ライブプレビューで形状を確認してください
- 生成されたborder-radius CSSプロパティをコピーしてください
計算式
border-radius: top-left top-right bottom-right bottom-left;
よくある質問
- 完全な円を作るには？
- 正方形の要素（幅と高さが同じ）にborder-radius: 50%を適用すると、要素のサイズに関係なく完全な円になります。
- border-radius値の'/'は何を意味しますか？
- スラッシュは楕円形の角のために水平と垂直の半径を区切ります。例: border-radius: 10px / 20pxは水平より垂直方向に大きく曲がる角を作ります。
- 特定の角だけを丸めることはできますか？
- はい、4値の短縮記法を使います。border-radius: 10px 0 0 10pxは左側の角のみを丸めます。順番は左上、右上、右下、左下です。