從基礎主題到自己的配色
- 01
選擇基礎主題
選擇具有完整顏色資料的相容主題。頁面會分別顯示相容主題數與已發布主題總數。
- 02
選擇角色並編輯
選擇背景、文字、強調色或狀態顏色，修改其十六進位值。分別調整淺色與深色模式，並在旁邊的對話預覽中檢查文字、程式碼與控制項。
- 03
比較與檢查
與原主題比較，檢查文字在各個預覽背景上的最低對比度。一般文字至少需要 4.5:1。編輯後，仍須檢查真實介面的焦點與鍵盤操作。
- 04
匯出並製作主題
下載同時包含兩種模式的 CSS 或 JSON；匯出的 JSON 可再次匯入。複製 Agent 提示詞，讓 Agent 依照這份配色建立、安裝並實測獨立主題。
例：更平靜的閱讀工作空間
從喜歡的主題開始，將閱讀背景調整為稍暖的中性色，再檢查次要文字是否仍然清晰。選擇容易辨認的強調色，用於主要按鈕與選取狀態。深色模式應獨立調整；直接反轉淺色模式的色值，可能讓警告或程式碼難以閱讀。
text
根據我從 Token Lab 匯出的 JSON 製作獨立 DSH 主題，目標版本為 0.1.3-alpha.1，原始碼提交為 d347e703908d0406b7a7ef80e3a0e594d86b2215。保留淺色與深色模式的全部 13 個語意 token。檢查文字對比度，建置主題，並在真實 Harness 中測試側欄、訊息、程式碼、選單與輸入框。提供安裝、重新啟動、切換與還原步驟。完成實測前，不得聲稱已通過驗證。繼續
常見問題
修改前需要了解的事項
關於格式、相容性、證據與回滾的簡明說明。
這篇指南核實哪些範圍？
本指南涵蓋：完整的淺色與深色模式編輯；文字對比度檢查；CSS、JSON 與 Agent 提示詞匯出
我應該先做什麼？
不必從空白開始設計配色。Token Lab 讓您在現有主題上逐一調整顏色，並即時查看對話預覽中的效果。
最需要記住的邊界是什麼？
Token Lab 編輯的是草稿，不會立即修改已安裝的主題。新配色需要針對 0.1.3-alpha.1 建置，再檢查真實側欄、訊息、程式碼、選單、輸入框、主題切換與還原流程。草稿暫存在目前瀏覽器分頁中；請匯出 JSON 保留持久副本。
匯出 CSS 就會安裝主題嗎？
不會。CSS 與 JSON 是配色檔案。使用 Agent 提示詞建立獨立套件，完成安裝與實測後，才能確認實際介面已套用。
對比度通過後就能立即發布嗎？
對比度只驗證部分配色效果。仍需檢查真實介面、鍵盤焦點、不同螢幕尺寸與實際執行行為。
繼續學習
檢視驗證證據並繼續操作
對比已釋出製品，或返回安裝文件。