Border Radius 生成器
颜色
可视化 border-radius 编辑器：均匀模式（快速圆角）、逐角模式（聊天气泡、Tab）、椭圆模式（blob——横半径 ≠ 纵半径）。多种常见形状预设。单位 `px`、`%`、`rem`。输出最短有效 CSS——四角相同则一值，不同则四值，椭圆使用 `h / v` 完整语法。
—
预设
预览
CSS
border-radius: 16px;使用方法
- 选预设开始，或关闭"均匀"逐角编辑。
- blob 形状开"椭圆"（每角两个半径）。
- 复制 `border-radius: …` 粘进 CSS。
常见问题
- 椭圆半径真有什么用？
- 多用于插画里有机的 "blob" 形状，每角不对称。标准 UI 几乎都是均匀或 4 值。
- px 与 % 区别？
- % 相对元素宽/高——正方形 50% 为圆，长方形为椭圆。px 与元素尺寸无关，是绝对值。
- Pill 预设在正方形上看起来不对。
- Pill = 999px 假定元素宽大于高，正方形上就变成圆。
- 浏览器支持？
- 四值 `border-radius` 与椭圆语法 2010 年起所有浏览器都支持，普世安全。