CSS border-radius 生成器
实时预览并创建 CSS 圆角:调整每个角,把四个角联动,或用 border-radius 的 8 个值创建有机形状(blob)。
使用方法border-radius 与 blob 生成器
广告
CSS border-radius 生成器: 用途
把四个角联动或分别调整,单位可选 px 或 %,形状会立即变化。在 Blob 模式下,用水平和垂直半径创建有机形状,并生成随机变体。CSS 随时可以复制。
使用方法
- 选择角或 blob。
- 拖动滑块调整。
- 复制生成的 CSS。
使用场景
- 制作圆角按钮和卡片。
- 为背景制作有机形状。
- 学习 border-radius 的写法。
常见问题
怎样只给部分角加圆角?
关闭“四角相同”选项,然后分别调整每个角。CSS 中的顺序是左上、右上、右下、左下。
怎样做有机形状(blob)?
使用 Blob 模式:它使用带斜杠的写法,如 30% 70% 70% 30% / 30% 30% 70% 70%,斜杠前的值是水平半径,斜杠后的是垂直半径。
真的免费吗?
是的,100%免费。无需注册,无需订阅,不限使用次数。所有工具:Tools123是免费的。