首页›文本·编码·数据›圆角样式生成器

圆角样式生成器

该工具提供四个独立可调的圆角参数与即时预览画布,帮助用户比较不同 border-radius 取值的效果,并生成可直接粘贴进样式表的声明代码。

永久免费本地计算 · 零上传

💡 该能力为 WDLeap 桌面版功能:整目录批量 · 断网可用 · 文件永不离开您的电脑。

怎么用

  1. 设定预览元素的尺寸
  2. 分别拖动四个角的半径滑块
  3. 观察预览区中的圆角形态
  4. 复制生成的 border-radius 代码

典型场景

按钮卡片圆角调参
统一设计系统的圆角规范
邮件模板内联样式编写
前端新手的 CSS 练习

常见问题

四个角可以设置不同半径吗?

可以,每个角独立滑动调节,也能一键锁定四角取相同值。

输出代码兼容老浏览器吗?

给出标准属性写法,如需带厂商前缀的兼容版本可在复制前手动补充。

预览的图形能自定义吗?

支持调整宽高与填充色,方便模拟按钮、头像、卡片等真实场景。

相关工具