已复制

CSS 圆角生成器

Border Radius 可视化调节,支持 8 个角独立编辑

CSS 代码
border-radius: 10px;
使用说明
8 个角独立调节
支持 CSS border-radius 的完整写法:top-left-xtop-left-ytop-right-xtop-right-ybottom-right-xbottom-right-ybottom-left-xbottom-left-y 共 8 个参数独立调节。拖动滑块时左侧预览方块实时更新。
单位切换
通过底部的 px / % 按钮可以在像素和百分比两种单位之间切换。切换后所有滑块的取值范围自动变更,CSS 代码也会相应更新。
快速等比例
每个角的 x 和 y 方向可独立设置。如需等比例圆角(对称),将 x 和 y 设置为相同值即可。预览块会实时渲染椭圆角效果。
复制 CSS 代码
面板底部实时展示生成的 CSS 代码,点击「复制代码」即可复制到剪贴板使用。