🎨 行銷素材卡片產生器

一套五種行銷素材卡片，打開即用、免安裝。上方切換工具，左側填內容，右側即時預覽。

共用操作

1. 選卡片：開啟後先看到首頁工具磚牆，點任一張進入編輯；之後用左上「☰ 選單」可隨時切換、「🏠 首頁」可回去。共 18 種，各卡片獨立保存內容。
2. 🪄 一鍵套用課程資料：填一次共用資料（課名／日期／講師／票價／報名連結…），自動帶入相關卡片，留空不覆蓋。
3. 選配色／調尺寸：色塊換色（彩虹鈕自訂）、卡片寬度、內文字級。
4. 風格主題（設計語言，與配色獨立）：現代卡片／雜誌編輯／溫潤手感／極簡科技／大膽潮流，五種有設計系統依據的整體視覺，一鍵換。顏色另在「配色」調。
5. 品牌套件：上傳 LOGO → 勾選後套用到所有卡片角落（可選位置）。
6. 圖片自由放置：主視覺背景、頭像上傳後，可用九宮格調整對齊位置、或切「完整顯示不裁切」。
7. 填內容：左側欄位即時反映到預覽。多筆型可「＋ 新增」「刪除」。✨ 範例可一鍵帶示意內容。

輸出方式

• 單張下載：滑到預覽卡片左上角，點 ⬇️ 只下載那一張。
• 逐張下載 / 下載組合圖：每張各存 PNG，或全部合成一張。
• </> HTML 程式碼：自帶樣式，貼進官網／部落格 HTML 模式即顯示。
• 📐 多尺寸輸出：把目前卡片自動套到 FB 1200×630 / IG 1080×1080 / 限動 1080×1920 三尺寸 PNG，免手動調。
• 🚀 一鍵生成銷售頁：把已填好的卡片依漏斗順序堆成一頁完整 landing page，自動開新分頁預覽並下載 HTML（可直接上線）。

卡片總覽（依推廣漏斗分類）

• 吸引：主視覺封面、痛點共鳴卡 — 抓住注意、勾起共鳴。
• 說明：課程資訊卡、課程亮點卡、課程大綱卡、適合對象卡 — 講清楚內容與價值。
• 信任：好評卡、數據戰績卡、講師介紹卡、前後對比卡 — 建立可信度。
• 轉換：方案比較卡、倒數優惠貼紙、報名步驟卡、安心保證卡 — 推動報名。
• 內容：金句語錄卡、常見問題卡 — 餵社群貼文、消除疑慮。
• 實體：結業證書、酷卡／名片 — 課後證書、雙面酷卡。

小提醒

• 下載功能需連網（載入 html2canvas）；編輯預覽離線可用。
• 頭像在本機處理，不會上傳伺服器。
• ✨ 填入範例：欄位空時可一鍵帶入示意內容再修改。