圖片 / App圖示
適用於Icon Composer的Liquid Glass圖示產生器
將前景PNG或SVG轉換為適用於Icon Composer和Xcode 26的Liquid Glass.icon套件。選擇背景色與內距,比較近似的淺色、深色、著色和透明預覽,並匯出扁平化的1024 × 1024 PNG。
適用於Icon Composer的Liquid Glass圖示產生器: 讓單張前景圖片與Icon Composer提供的自動背景漸層分開。工具會依照您設定的內距置中圖稿,並將其打包成ZIP中的.icon套件。瀏覽器預覽會呈現圓角方形和手錶圓形,並提供近似的著色與透明模式。扁平化PNG會使用所選的純色基底,不含玻璃材質。預覽形狀和外觀控制項不會變更套件設定。 全程在瀏覽器中於本機執行,檔案不會上傳至伺服器。
- 分類
- 圖片工具
- 使用次數
- 在瀏覽器中
- 費用
- 免費・免註冊
- 可用狀態
- 可立即使用
全程在瀏覽器中執行
Liquid Glass是Apple隨iOS 26推出的設計語言。App圖示會使用可適應外觀和周遭環境的圖層與材質。 Apple 開發人員文件 · 人機介面指南
將圖稿拖曳至此,或瀏覽檔案。透明圖稿效果最佳。上限為20 MB。
Icon Composer會根據你的顏色,以自動漸層填滿背景。這些預覽和扁平化PNG使用純色基底;請在Icon Composer中調整最終漸層。
這是近似預覽,最終外觀會由iOS呈現。形狀、著色和透明外觀僅為示意,不代表 Apple 的材質呈現方式。
解壓縮ZIP,在適用於Xcode 26的Icon Composer中開啟AppIcon.icon,檢視材質和外觀後,再將.icon套件加入Xcode專案。對於較舊的目標,請在資產目錄中使用扁平化PNG。 Apple 的 Icon Composer 指南
此產生器會在背景填色上方保留一個前景圖層。不會編輯圖層深度、折射、高光或陰影。請在Icon Composer中加入並調整其他圖層。預覽控制項不會變更套件的外觀設定。
你的圖片會留在瀏覽器中。不會上傳任何內容。
Liquid Glass 與 App 圖示設計
Apple 在開發人員文件和人機介面指南中介紹 Liquid Glass 與可調整的 App 圖示。請依照其指南,讓圖示在不同平台和外觀下都清楚易辨。https://developer.apple.com/documentation/technologyoverviews/liquid-glass 和 https://developer.apple.com/design/human-interface-guidelines/app-icons
Icon Composer 與 Xcode
Icon Composer 支援分層圖稿和材質調整。將擷取的 .icon bundle 加入 Xcode 專案前,請先在其中開啟並檢查。本產生器會提供一個前景圖層,並根據您的色彩自動產生背景漸層。https://developer.apple.com/icon-composer/ 和 https://developer.apple.com/documentation/Xcode/creating-your-app-icon-using-icon-composer
使用方式
- 選擇前景圖稿,建議使用透明PNG或SVG,並設定內距與背景色。
- 比較淺色與深色主畫面、平台形狀,以及近似的著色或透明外觀。
- 下載並解壓縮.icon ZIP,在Icon Composer中開啟套件、檢查最終外觀,再將其加入Xcode專案。您也可以下載扁平化PNG,供較舊的目標使用。
隱私與限制
圖片會在您的瀏覽器中解碼並匯出。您的圖稿不會上傳。
相關工具
常見問題
什麼是Liquid Glass?
Liquid Glass是Apple在iOS 26中推出的設計語言。App圖示可以使用會隨不同外觀調整的圖層與材質。本頁會準備一個起始套件;最終外觀由作業系統呈現。
如何在Xcode 26中使用下載的檔案?
解壓縮ZIP,並在Icon Composer中開啟AppIcon.icon套件。在那裡檢查並儲存圖示,接著將.icon套件加入Xcode專案,並選取它作為App圖示。Apple的Icon Composer指南會說明專案設定方式。
這個編輯器支援分層景深嗎?
它會在背景填色上方提供一個前景圖層,但不會編輯多個圖層、景深、折射、亮部或陰影。請在Icon Composer中加入圖層並調整材質。
預覽是iOS的最終外觀嗎?
不是。圓角方形與圓形,以及著色和透明效果,都只是近似預覽。最終外觀由iOS呈現。瀏覽器和扁平化PNG使用純色背景;自動漸層則由Icon Composer提供。
免費工具・使用在瀏覽器中次・免註冊