健身工作室

高強度健身房:課表、教練、方案價格、學員蛻變數據

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. 1

    導覽與主視覺

    品牌導覽列搭配輪播動詞大標、雙 CTA 與現役學員數據列,下方接螢光標語跑馬燈。

    hero
  2. 2

    本週課表

    以時段乘星期的橫向捲動網格呈現一週團體課,並用色塊標示肌力、燃脂、格鬥與修復四類課程。

    timeline
  3. 3

    教練陣容

    四位教練的漸層人物卡,滑過即翻出專長領域與戰績資歷。

    team
  4. 4

    訓練方案

    基礎、猛攻、全能三種月費會籍並列,中間方案以螢光黃強調為最多人選。

    pricing
  5. 5

    學員成果數據

    螢光黃數據帶以捲動觸發的數字滾動呈現蛻變人數、體脂變化與續約率等成果。

    stats
  6. 6

    學員見證

    兩則真實學員的訓練心得引言卡,附上身分與訓練月數。

    testimonial
  7. 7

    免費體驗預約

    左側說明免費體驗課內容與入會優惠,右側為含偏好時段選擇與送出成功狀態的預約表單。

    form
  8. 8

    頁尾

    品牌標誌、門市地址電話與營業時間,搭配訓練、工作室、支援三欄連結與版權標語。

    footer

你拿到的是原始碼

不是 npm 套件、不是 zip 檔。安裝之後整頁的 TypeScript 原始碼就在你的 repo 裡,可以任意修改、無執行期相依、沒有到期失效機制——我們的網站故障不會影響你已上線的網站。

瀏覽其他 103 套模板 →