健身工作室
高強度健身房:課表、教練、方案價格、學員蛻變數據
Pro產業fitness8 個區段
安裝
npx shadcn@latest add "https://webberui.com/r/fitness-studio.json?t=<安裝 token>"整頁原始碼會落在 app/templates/fitness-studio/。也可以改用長效授權金鑰:在 components.json 的 registries 設定 Authorization: Bearer <key>,適合 CI 或多人共用的專案。使用範圍見授權條款。
包含的區段
同一套模板內的區段共用設計 token,所以抽換、重排之後配色、間距與動畫節奏仍然一致。可在區段組裝器裡挑選組合。
- 1
導覽與主視覺
品牌導覽列搭配輪播動詞大標、雙 CTA 與現役學員數據列,下方接螢光標語跑馬燈。
hero - 2
本週課表
以時段乘星期的橫向捲動網格呈現一週團體課,並用色塊標示肌力、燃脂、格鬥與修復四類課程。
timeline - 3
教練陣容
四位教練的漸層人物卡,滑過即翻出專長領域與戰績資歷。
team - 4
訓練方案
基礎、猛攻、全能三種月費會籍並列,中間方案以螢光黃強調為最多人選。
pricing - 5
學員成果數據
螢光黃數據帶以捲動觸發的數字滾動呈現蛻變人數、體脂變化與續約率等成果。
stats - 6
學員見證
兩則真實學員的訓練心得引言卡,附上身分與訓練月數。
testimonial - 7
免費體驗預約
左側說明免費體驗課內容與入會優惠,右側為含偏好時段選擇與送出成功狀態的預約表單。
form - 8
頁尾
品牌標誌、門市地址電話與營業時間,搭配訓練、工作室、支援三欄連結與版權標語。
footer
你拿到的是原始碼
不是 npm 套件、不是 zip 檔。安裝之後整頁的 TypeScript 原始碼就在你的 repo 裡,可以任意修改、無執行期相依、沒有到期失效機制——我們的網站故障不會影響你已上線的網站。
瀏覽其他 103 套模板 →