Squircle 不是圓角
把圓角滑條拉滿,看起來仍像一張貼紙。
iOS 主屏幕吃的是連續曲率(超橢圓),不是 CSS 的 border-radius。2025-12-10 的版本把 Squircle 和漸變編輯放進同一條路徑。
Zapicon · Squircle
圆角矩形
Squircle
左边是普通圆角矩形。右边是连续曲率。iOS 主屏幕认后者。
什麼時候開
做 iOS 或要跟 iOS 放在一起的營銷圖:開 Squircle,留內邊距,底不要透明。Apple 會鋪滿遮罩。
做 Android:別依賴 Squircle 當最終形狀。系統還要套自適應遮罩。前景往裏收。見 設計規範。
做 Windows / Web:方形或透明底更常見。Squircle 當預覽可以,當唯一真源不行。
漸變底在這一版一起好用了。兩色加角度夠大多數品牌。第三色用主題預設,見 二十五套預設。
高 DPI 上預覽發糊,後來在 1.1.5 修過。若你還在舊預覽裏對像素,更新客户端。
不要做的
- 不要用圓形當 iOS 圖標。App Store 會再套一層。
- 不要把文字放到 Squircle 邊緣。輔助線在,見 輔助線不進包。
- 不要給每個平台各畫一個圓角。先出一套,再只改認不出的那一端。
最後更新於