/ 工具
■/ 工具查找器
109 个工具
/ Border Radius 生成器
/ 所选工具
■Border Radius 生成器 - 免费 生成器 工具
可视化 CSS border-radius 生成器，支持单独控制各个圆角
■ 01
什么是 CSS Border Radius？
CSS border-radius 属性会把元素外边框边缘的角变圆。你可以把四个角设为相同的值，也可以为每个角指定不同的值来创建独特的形状。
■ 02
它是如何工作的？
border radius 可以用 1 到 4 个值指定。用 1 个值时，四个角都相同。用 2 个值时，第一个应用于左上/右下，第二个应用于右上/左下。用 3 个值时：左上、上……
■ 03
示例场景
涵盖四角相等、胶囊形状和不同的角，让你可以快速比较常见的输入与输出。
/ 相关工具
/ 代码
■所选工具的源代码，显示在此处，右侧为实时运行版本。
/ 源代码
TypeScript
typescript
// No external dependencies needed - generates CSS border-radius strings
interface BorderRadius {
topLeft: number;
topRight: number;
bottomRight: number;
bottomLeft: number;
unit: 'px' | '%' | 'rem';
}