你每天都會用到的開發者工具,全都集中在同一個地方。

轉換器、格式化工具、雜湊、驗證器,以及那些你總是一再重開的小工具,都留在一起,不再散落在各個分頁裡。

GitHub
/ 工具
/ 工具搜尋
109 款工具
/ Border Radius 產生器
/ 選定的工具

Border Radius 產生器 - 免費 產生器 工具

視覺化 CSS border-radius 產生器,可個別控制各角

01

甚麼是 CSS Border Radius?

CSS border-radius 屬性會將元素外邊框邊緣的角落變圓。你可以將四個角落設為相同值,或為每個角落指定不同的值來建立獨特的形狀。

02

運作原理是甚麼?

Border radius 可以用 1 到 4 個值來指定。用 1 個值時,所有角落相同。用 2 個值時,第一個套用於左上/右下,第二個套用於右上/左下。用 3 個值時:左上、右上…

03

範例情境

涵蓋四角相等、藥丸形與不同角落,讓你能快速比較常見的輸入與輸出。

/ 相關工具
/ 程式碼

選定工具的原始碼,與右側的即時版本並列顯示。

/ 原始碼
TypeScript
typescript
// No external dependencies needed - generates CSS border-radius strings

interface BorderRadius {
  topLeft: number;
  topRight: number;
  bottomRight: number;
  bottomLeft: number;
  unit: 'px' | '%' | 'rem';
}
Buidl Now 圖示

把所有實用工具集中在一處,讓你專注在開發流程中。

挑一個工具、完成檢查、複製你需要的內容,然後回到真正的產品工作上。

為講求快速交付的建構者打造的開發者工具。© 2026 Buidl Now. 保留所有權利。