CSS 圆角生成器
四角可分别设置、可一键联动，支持 px 与百分比，自动按 CSS 规则简写并实时预览。
CSS 代码
使用指南
- 选单位与联动
先定单位（px 或百分比）。只想要统一圆角就保持「联动」，改任意一格其它三格同步跟着变。
- 单独微调
切到「独立调整」后逐个改，做卡片只圆上方两角、做聊天气泡只圆三角这类需求都能实现。
- 复制 CSS
代码框里已经是压缩后的简写形式，复制后直接替换样式里的 border-radius 即可。
常见问题
为什么代码里的值和输入的不一样多？
因为 CSS 允许简写。四角都是 12px 时写 border-radius: 12px 效果完全一样，工具会自动压缩成最简形式，不是把值弄丢了。
999px 为什么就是胶囊？
浏览器遇到超过元素高度一半的半径时会按最大可能值渲染，所以 999px 和「刚好一半」视觉一致。用足够大的数省得去算尺寸。
百分比是按什么算的？
水平方向按元素宽度、垂直方向按元素高度分别计算。所以 50% 在 200×100 的方块上会得到一个椭圆角，而不是正圆的四分之一。
四个角不同时的顺序是什么？
顺时针从左上开始：border-radius: 左上 右上 右下 左下。这个顺序和 padding、margin 的顺时针规则一致。