視覺樣式詞條 3-29

圓角Border Radius

也常叫做：圓角、圓弧、Border Radius

你可能會這樣說

卡片、按鈕、圖片的角落想統一風格，但不知道圓角數字怎麼定，試起來一下太銳利、一下像兒童氣泡。

圓角是角落的圓弧程度，數字越大越柔和。它其實在替網站定性格：小圓角（4 到 8px）精準專業、中圓角（12 到 16px）友善現代、大圓角（24px 以上）或膠囊形活潑可愛。

重點是全站統一幾組數字：例如按鈕 8、卡片 12、標籤用膠囊全圓。每個元件自己發明圓角，再有質感的設計也會散掉。

圓角也可以只做單角，做標籤或色塊的變化；跟 AI 說「左上 16、其他 0」這種指定就行。

圓角

0 是直角，數字越大越圓；超過一半寬度就會變成膠囊或圓形。

圖 3-29　拖曳拉桿（或換選項），看屬性怎麼即時改變畫面。

中文就可以

請統一全站的圓角系統：
按鈕 8px、輸入框 8px、卡片 12px、圖片 12px、標籤用膠囊全圓。
先列出目前不符合的元件清單給我，再一併修正。
卡片內的圖片上側圓角要跟著卡片的 12px，不能尖角刺出來。
行動版維持相同數字，不要另外縮小。