液態玻璃登陸頁v1.0.3
使用這個 Skill：建置網頁。
人氣上升
5.035 次下載1 個喜歡1 次收藏
$4.99
購買這個 Skill 可以得到什麼？打造深色霧面玻璃風格的登陸頁，搭配電影感 Hero、聚焦的電子郵件收集表單與克制的編輯式故事。玻璃膠囊在近黑底色上於邊緣捕捉光線，超大襯線標題中有一個斜體字，產品則以附圖表的即時郵件預覽呈現。接著是定價、FAQ、結尾收集表單，以及範例刊號、歸檔、章程、加入、登入與法律頁面。預設為一個可離線開啟的獨立檔案。
更新於 2026年10月3日
效果預覽
相似的 Skills
查看所有 Skills
你將獲得
- 為虛構的 Nightfold 打造、約十幾個區塊的登陸頁，從玻璃 Hero、即時郵件預覽到定價、FAQ、結尾收集表單與幽靈字標頁尾。
- 七個路由：附付費牆的範例刊號、可搜尋與篩選的歸檔、章程、加入、登入、隱私權與條款，以及經過設計的 404。
- 可運作的收集表單、收件匣選擇器、附席位調整器的月繳／年繳定價、讀者心得輪播與倒數計時，四種字體內嵌在單一離線檔案中。
適合
- 主要目的是收集電子郵件地址的電子報、候補名單、私人測試版與上線活動。
- 想要黑色玻璃質感、又不想手動調整模糊、邊框與高光的創辦人。
- 能以真實畫面（例如一封郵件、App 畫面或更新日誌）而非圖庫照片呈現的產品。
不適合
- 明亮、色彩繽紛或以插畫為主的品牌；這套設計只有深色，也沒有強調色。
- 開箱即寄出真實郵件：收集、加入與登入表單在你串接郵件服務前只會在頁面中顯示確認。
- 導覽層級很多的大型內容網站；這是一張轉換頁，只附少數輔助路由。
新品上市與 App 成長網頁設計與數位體驗建置網頁建置 Landing Page風格鎖定轉換導向電影感玻璃擬態暗色單色液態玻璃襯線展示字
關於此 Skill
給一個名稱和一句承諾，就能變成一張深色登陸頁，感覺像覆在影片上的霧面玻璃：會捕捉光線的玻璃膠囊、帶一個斜體字的巨大襯線標題，以及置於正中央的電子郵件收集表單。完整範例是虛構電子報 Nightfold，附即時郵件預覽、會員定價與七個可運作的路由。預設成果是一個獨立檔案，任何瀏覽器都能離線開啟。
你會得到
- 玻璃膠囊頁首、附電子郵件收集的電影感 Hero、附圖表的即時郵件預覽、數據條帶與方法分欄
- 刊號選擇器、編輯群、讀者心得、可切換月繳／年繳的會員定價、近期刊號、FAQ，以及附倒數計時的結尾收集表單
- 範例刊號、歸檔、章程、加入、登入與法律頁面，外加經過設計的 404
- 內嵌 Instrument Serif、Newsreader、Geist 與 Geist Mono 字體，零網路請求
使用方式
- 提供你的名稱、產品是什麼、訂閱後能得到什麼、發刊頻率、價格，以及背後的團隊成員。
- 你的 Agent 會填滿各區塊，把你的產品在玻璃面板中呈現為即時畫面，並製作深色圖片或使用你的 Hero 影片素材。
- 開啟頁面，試用收集表單、定價切換與歸檔篩選，然後提出修改。
生成圖片可能產生你的圖像工具的使用費用。表單只會在頁面中顯示確認，在你串接自己的郵件服務之前不會寄出任何內容。
開始前需要準備什麼
- 你需要提供
- 名稱、產品是什麼，以及訪客訂閱後能得到什麼 · 發刊頻率或上線日期、價格或方案、幾個真實的事實，以及背後的團隊成員 · 選用：你自己的深色 Hero 影片素材與團隊照片
- 相依項目
- Agent 所在電腦需安裝 Node.js 18 以上版本，用來執行內建腳本產生單一離線檔案 · 產生檔案時需要網路連線，以便下載一次字型並內嵌 · 選用：Agent 內的圖像生成工具；沒有時，媒體框會使用深色佔位表面
- 外部費用
- 用你的 Agent 的圖像工具生成深色圖片，可能產生該工具的使用費用。沒有圖像工具時頁面仍可建置，每個媒體框會使用深色佔位表面。
- 最近實測
- v1.0.3 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
使用者評價
正在載入評價…