CSS 圓角產生器
免費線上 CSS 圓角產生器。即時預覽並產生 CSS border-radius 程式碼，支援 px 與 % 單位。
即時預覽並產生 CSS border-radius 圓角程式碼，輕鬆為按鈕、卡片等 UI 元件建立自訂圓角與有機造型。
CSS 圓角產生器
免費線上 CSS 圓角產生器。即時預覽並產生 CSS border-radius 程式碼，支援 px 與 % 單位。
關於這個工具
即時預覽並產生 CSS border-radius 圓角程式碼，輕鬆為按鈕、卡片等 UI 元件建立自訂圓角與有機造型。
圓角設定
區塊設定
背景顏色
區塊顏色
圓角設定
px
左上角 (10px)
右上角 (10px)
右下角 (10px)
左下角 (10px)
結果將顯示於此...
預覽
CSS 程式碼
圓角設定
區塊設定
背景顏色
區塊顏色
圓角設定
px
左上角 (10px)
右上角 (10px)
右下角 (10px)
左下角 (10px)
常見問題
關於這個主題的常見疑問與實用解答。
可以為每個角設定不同的圓角值嗎？
可以，您可以分別設定左上、右上、右下與左下各角的圓角值，或使用「所有角落」一次統一設定。
支援哪些單位？
支援像素（px）與百分比（%）。使用百分比可建立響應式造型，例如圓形（50%）或膠囊形狀。
可以製作圓形或膠囊形狀嗎？
可以，將所有角設為 50% 即可在正方形元素上建立完美圓形，或在矩形元素上使用較大的像素值建立膠囊形狀。
我的資料會被傳送到伺服器嗎？
不會，border-radius CSS 生成完全在您的瀏覽器中處理。您的圓角值在本地處理，不會上傳任何資料。