首页 › 前端工具 › CSS圆角
CR

CSS圆角

可视化调整border-radius四角圆角,支持统一和独立模式

功能CSS 圆角生成器
可调属性四角独立 / 统一圆角
输出实时预览 + CSS 代码
圆角预览0-100px
生成的 CSS 代码21 字符
border-radius: 12px;
模式统一
左上/右上12px / 12px
右下/左下12px / 12px

CSS 圆角生成器说明

border-radius 属性用于设置元素的外圆角,可以单独控制四个角,也可统一设置。值为像素或百分比,50% 可创建圆形。

四角独立:依次为左上、右上、右下、左下。语法 border-radius: TL TR BR BL,与 margin/padding 简写顺序一致。

特殊形状:胶囊形需配合较小高度,圆形需宽高相等且圆角为 50%。波浪形和叶片形通过不对称圆角实现。

前端工具