Corner Radius: Live Preview

为按钮、卡片、面板或 App 图标挑准那个 corner radius（圆角半径）——在写下第一行代码之前，就按真实尺寸实时看到效果。 大多数圆角决策都是盲调：填个数字、重新 build、眯着眼看、再改一个数字。RadiusPreview 把这套循环压缩成一根滑块。拖动它，屏幕上一个可缩放的真实图形会即时改变形状——0 到 160 pt，整体统一或四角独立。在 Apple 的 continuous 圆角（squircle / 超椭圆）与真正的 circular 圆弧之间切换，用眼睛真正读到的方式看清差别。形状调好的那一刻，对应的 CSS、SwiftUI 或 SVG 代码已经写好，直接复制即可。 你能得到什么 - 一根滑块，实时重塑真实 UI 表面——不用重新 build，不用猜 - 与屏幕上这一形状完全对应、可直接复制的 CSS、SwiftUI 和 SVG 代码 - 四个角独立控制，适合面板、聊天气泡与标签页 - continuous 与 circular 的对比，终于讲清了为什么一种看起来更柔和 - 12 组现成预设——card、button、pill、sheet、squircle 22、App 图标遮罩等 - 本机保存的形状库，让定好的圆角值不必再被反复争论 适合谁 - 需要让 SwiftUI 界面贴合系统观感的 iOS 开发者 - 手写 border-radius 的 Web 与前端开发者 - 为设计系统制定圆角阶梯（radius scale）的产品与 UI 设计师 - 任何为「12 还是 16 更好看」争论过的人 为什么不直接在检查器里目测？ 因为 260 pt 宽的卡片上的 44 pt 圆角，和 56 pt 按钮上的 44 pt 完全不是一回事；24 的 continuous 曲线也对不上 24 的 circular 曲线。按真实尺寸并排看清两者只要几秒——组件上线后再返工要花掉一天。 学习 内置 Learn 区有 6 篇讲解文章：continuous 与 circular 的区别、嵌套圆角（nested radius）规则、如何搭建圆角阶梯、pill 的半高技巧、CSS 与 SwiftUI 中的分角语法、以及如何与平台观感保持一致，并附参考资料清单。 更多细节 - 圆角滑块 0–160 pt，宽高 80–340 pt，边框宽度 0–12 pt - 实时参数条：pt 单位的圆角值、W x H 尺寸、当前曲线类型 - 一键把代码复制到剪贴板，或通过 iOS 分享面板发送（仅文本） - 记住你的默认导出格式 - 圆角阶梯参考条：0/4/8/12/16/24/32/48 - 形状保存带缩略图与时间戳；点按即可重新载入，另有删除按钮 - 每天 19:00 一条本地提醒（在系统弹窗中自行选择开启），设置页内可直达 iOS 通知设置 - 恢复购买 - 全程深色界面 隐私 一切都在你的设备上运行。无账户、无登录、无广告、无跟踪，完全离线可用。 完整权限 Premium 解锁四角独立圆角控制、SwiftUI 与 SVG 代码导出、continuous 与 circular 并排对比，以及全部高级预设。提供周订阅、年订阅，或一次性 lifetime 买断。CSS 导出、统一圆角模式、免费预设、圆角阶梯参考条、已保存形状和 Learn 区无需订阅即可使用。 打开 App，拖动滑块直到那个角看着对了，然后把代码粘进你的项目。 Terms of Use (EULA): https://web-levi.web.app/terms Privacy Policy: https://web-levi.web.app/privacy-policy 有疑问？ https://web-levi.web.app/#contact