嘗試讓 AI 還原了一下昨晚蘋果發佈的液態玻璃效果 ​順便整理成了提示詞，幫你用 AI 生成這種風格的網頁 下面是幾個模型的使用效果和提示詞👇

## 藏師傅的蘋果液態玻璃風格網頁提示詞，複製注意鏈接·的空格 基於下面蘋果 WWDC2025發佈會關鍵信息，幫我用類似蘋果發佈會PPT的Bento Grid風格的視覺設計生成一箇中文動態網頁展示，在線引用背景圖片，背景圖片為：https://i. ibb. co/xtN61cRf/Comfy-UI-Output-4-1.png ## 網頁具體要求為： 1. 使用Bento Grid風格的視覺設計，文字顏色為白色，高亮文字色為蘋果標誌性的漸變，帶有玻璃質感的卡片，卡片不需要深色背景 2. 強調超大字體或數字突出核心要點，畫面中有超大視覺元素強調重點，與小元素的比例形成反差 3. 網頁需要以響應式兼容更大的顯示器寬度比如1920px及以上 4. 中英文混用，中文大字體粗體，英文小字作為點綴 5. 簡潔的勾線圖形化作為數據可視化或者配圖元素 6. 運用高亮色自身透明度漸變製造科技感，但是不同高亮色不要互相漸變 7. 數據可以引用在線的圖表組件，Apache ECharts 5（https://cdn. jsdelivr. net/npm/echarts@5.6.0/dist/echarts.min.js）樣式需要跟主題一致 8. 使用HTML5、TailwindCSS 3.0+（通過CDN引入）和必要的JavaScript 9. 字體引用 Google Font 的字體 10. 圖標引用Font Awesome （https://use .fontawesome.com/releases/v5.11.2/css/all.css） ，避免使用emoji作為主要圖標 11. 不要省略內容要點 ## 卡片樣式嚴格參考如下實現方式： CSS樣式：/* 容器 */.liquidGlass-wrapper { position: relative; display: flex; overflow: hidden; padding: 0.6rem; border-radius: 2rem; cursor: pointer; box-shadow: 0 6px 6px rgba(0, 0, 0, 0.2), 0 0 20px rgba(0, 0, 0, 0.1); transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);}/* Hover效果 */.liquidGlass-wrapper:hover { padding: 0.8rem; border-radius: 2.5rem;}/* 扭曲層 */.liquidGlass-effect { position: absolute; z-index: 0; inset: 0; backdrop-filter: blur(3px); filter: url(# glass-distortion); }/* 色調層 */.liquidGlass-tint { position: absolute; z-index: 1; inset: 0; background: rgba(255, 255, 255, 0.25);}/* 光澤層 */.liquidGlass-shine { position: absolute; z-index: 2; inset: 0; box-shadow: inset 2px 2px 1px 0 rgba(255, 255, 255, 0.5), inset -1px -1px 1px 1px rgba(255, 255, 255, 0.5);}/* 內容層 */.liquidGlass-text { position: relative; z-index: 3; transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);} .liquidGlass-wrapper:hover .liquidGlass-text { transform: scale(0.95);}/* 子項樣式 */.menu-item { padding: 0.4rem 0.6rem; border-radius: 0.8rem; transition: all 0.1s ease-in;} .menu-item:hover { background-color: rgba(255, 255, 255, 0.5); box-shadow: inset -2px -2px 2px rgba(0, 0, 0, 0.1); backdrop-filter: blur(2px);}

⚠️ 提示詞使用注意事項： 如果你不想要一圖流的話可以刪除提示詞裡的“儘量在一頁展示所有內容”的這部分。 這個風格必須要背景圖片，沒有的話辨識度就會很受影響，建議加上，建議用深色背景圖。 建議優先使用 Gemini 2.5 Pro 生成，DeepSeek R1 0528 可以用，但是他無法搞定後面的圖片扭曲部分。