可视化生成 CSS 圆角代码，支持独立角点控制、实时预览和一键复制
开发者工具
关于此工具
圆角生成器可让您可视化设计 CSS 圆角值，独立控制每个角点。它具有实时预览框、同步调整的链接模式、px 和 % 之间的单位切换、预设形状以及一键复制生成的 CSS 代码功能。
主要功能
- 每个角点独立的滑块控制
- 实时预览，形状即时更新
- 链接模式，同时调整所有角点
- 像素和百分比单位切换
- 预设形状：方形、圆形、胶囊形、叶形、斑点形、交替形
- 一键复制生成的 CSS 代码
使用场景
- 为 UI 组件和卡片设计自定义圆角
- 为现代网页设计创建有机斑点形状
- 快速生成胶囊形按钮和输入框
- 尝试非对称圆角以实现创意布局
- 复制可直接用于生产的圆角 CSS 代码
css
border-radius
generator
preview
常见问题
什么是圆角生成器？
圆角生成器是一款在线开发者工具，可创建自定义 CSS 圆角值，支持独立角点控制、实时预览和一键复制。它完全在您的浏览器中运行，不会向任何服务器发送数据。
我可以独立控制每个角点吗？
是的，该工具为每个角点（左上、右上、左下、右下）提供独立滑块。您还可以切换链接模式来同时调整所有角点。
该工具支持百分比单位吗？
是的，您可以使用单位切换在像素（px）和百分比（%）之间切换。这对于使用 50% 圆角创建圆形或椭圆形特别有用。
有预设形状可用吗？
是的，该工具包含常见形状的预设，如方形、圆形、胶囊形、叶形、斑点形和交替形。点击预设即可即时应用相应的圆角值。
我可以在手机上使用圆角生成器吗？
是的，圆角生成器完全响应式设计，支持所有设备，包括智能手机、平板电脑和桌面电脑。