CSS border-radius 生成器
使用px、%或rem单位独立或联动调整四个角的border-radius值,提供实时预览和可直接复制的CSS代码。
通过联动或单独调整四个角,并选择 px、% 或 rem,生成 CSS border-radius 声明。
如何生成 CSS 圆角
- 选择四个角是否保持联动。
- 调整各角滑块并选择单位。
- 查看预览并复制 border-radius 声明。
生成规则
每个角使用 0 到 100 的整数滑块,并直接附加所选单位。
四个数值相同时输出一个简写值,不同时按 CSS 四角顺序输出四个值。
隐私与限制
所有处理都在浏览器本地完成。切换单位时不会进行数学换算,只会保留原数值并更换单位。
Border radius 常见问题
可以单独调整每个角吗?
可以,关闭 Linked。
支持哪些单位?
px、% 和 rem。
从 px 切换到 rem 会换算吗?
不会,数字保持不变。
四个值的顺序是什么?
左上、右上、右下、左下。
可以复制 CSS 吗?
可以直接复制生成的声明。