程式碼變形首頁

安裝

整頁原始碼會落在 app/templates/code-morph-home/。也可以改用長效授權金鑰：在 components.json 的 registries 設定 Authorization: Bearer <key>，適合 CI 或多人共用的專案。使用範圍見授權條款。

包含的區段

同一套模板內的區段共用設計 token，所以抽換、重排之後配色、間距與動畫節奏仍然一致。可在區段組裝器裡挑選組合。

1. 1

   導覽列與程式碼變形英雄區

   含 sticky 導覽列、滑鼠聚光燈標題區、四語言自動輪播的程式碼 Morph 視窗與客戶信任 Logo 列。

   hero
2. 2

   捲動驅動三步驟工作流

   以捲動進度推進「貼上原始碼 → 建立語意圖 → 產出慣用實作」三階段，左側進度軌與右側面板同步變形。

   timeline
3. 3

   核心功能六宮格

   以六張圖示卡片說明語意等價轉譯、自動等價測試、即時預覽、CI 整合、型別安全與多語言支援。

   features
4. 4

   關鍵數據帶

   四項成效數字以進入視窗即滾動計數呈現，含支援語言、測試等價率、月轉譯次數與首行延遲。

   stats
5. 5

   客戶見證

   三則遷移團隊的推薦語錄，搭配漸層字母頭像與職稱資訊卡片。

   testimonial
6. 6

   方案定價

   年繳／月繳滑動切換的三張方案卡，價格數字以動畫翻轉更新並標示最受歡迎方案。

   pricing
7. 7

   結尾行動呼籲

   置中光暈背景搭配大標與雙按鈕，引導免費開始或查看工作流程。

   cta
8. 8

   頁尾

   品牌簡介、社群連結圓鈕與產品／資源／公司三欄連結，底部為版權與條款列。

   footer