Skip to main content
主題是畫面共用的色彩調色盤與圓角設定。每個檔案都有一個主題與外觀（淺色或深色），畫面會使用主題的權杖來套用樣式。編輯主題後，所有使用該主題的畫面都會跟著更新。你的團隊因此能依循同一套決策，不必在每則提示詞中重複描述顏色。 你建立或產生的主題會儲存到組織中，並列在 Home 的 Themes 下，因此組織中的任何檔案都能使用它們。

​
為檔案選擇主題

在檔案內的提示詞撰寫器中，挑選新畫面的主題與外觀。Home 的提示詞框中沒有主題按鈕。
1

開啟主題選單

在提示詞撰寫器中，點擊主題按鈕。它會顯示目前主題的色票；當主題為 Automatic 時，則顯示色輪。選單標題為 Theme for new screens。
2

選擇主題

選擇 Automatic、你組織的某個主題（列在最前面），或內建主題：Default、Blue、Grayscale、Green、Ice、Orange、Red、Rose、Violet 或 Yellow。
3

選擇外觀

在 Appearance 下，選擇 Light 或 Dark，或選擇 Automatic，讓 Flowstep 根據你的提示詞為每個畫面決定外觀。例如，「深色儀表板」會產生深色的畫面。
你的選擇會套用到接下來產生的畫面。畫布上既有的畫面會保留原本的外觀。

​
讓 Flowstep 設計主題

當檔案尚未有主題時（例如新檔案，且主題保持為 Automatic），Flowstep 會在產生第一批畫面的同時，設計一個自訂主題。處理期間，聊天中會顯示 Designing theme 步驟。 Flowstep 會根據以下內容建立主題：
  • 你在提示詞中提到的顏色
  • 你的設計指南中的顏色
  • 附件中的品牌色，以及你貼上的連結中的品牌色
  • 當沒有更具體的資訊時，提示詞所描述的產品與氛圍
主題會取得一個簡短的名稱、完整的淺色與深色調色盤，以及圓角設定。它會儲存到你組織的 Home 上 Themes 下，且該檔案之後產生的每個畫面都會使用它。 檔案一旦有了主題，Flowstep 就不會自行再設計另一個。若要取得全新的主題，請在主題選單中再次選擇 Automatic。下一次產生時會設計新主題，檔案也會改用它。如果 Flowstep 無法設計主題，檔案會退回使用內建主題。
在第一則提示詞中提及你的品牌色，或在產生前於設計指南中設定品牌色，生成的主題就會以它們為起點。

​
變更單一畫面的主題

若要重新套用單一畫面的樣式，又不影響檔案的其他部分：
  1. 在畫布上選取該畫面。
  2. 在畫面上方的選單中，點擊 Theme 按鈕。
  3. 選擇你組織的某個主題或內建主題，或在 Light 與 Dark 之間切換。
切換主題會立即重繪畫面。在 Light 與 Dark 之間切換，則會要求 AI 重新設計該畫面的樣式，與 AI 編輯相同。產生作業進行中，此選單無法使用。

​
編輯主題

從 Home 的 Themes 區塊開啟主題。主題編輯器會顯示主題的即時預覽，右側為 Theme settings。使用頂端的 Light 與 Dark 按鈕切換預覽，並點擊主題名稱即可重新命名。
  • Colors：每個色彩群組都有一個淺色色票與一個深色色票：Primary、Secondary、Accent、Muted、Destructive、Background、Card、Popover、Border、Input、Ring、Charts 與 Sidebar。點擊色票即可編輯其顏色，例如群組的填色與文字色。你可以使用取色器，或輸入十六進位值。
  • Radius：選擇圓角級距（Square、Slight、Balanced、Soft 或 Round），或選擇 Custom 並拖曳 Base radius，設定你自己的圓角。
你的編輯會以草稿形式儲存，因此你在編輯時，畫面不會改變。準備好之後：
  • 點擊 Publish，即可更新所有使用該主題的畫面。Flowstep 會以「Published. Screens using this theme are updating.」（已發布，使用此主題的畫面正在更新。）確認。
  • 點擊 Reset changes，即可捨棄尚未發布的變更。使用該主題的畫面不會受到影響。
若要移除主題，請點擊 Theme settings 底部的 Delete theme，或點擊 Home 上 Themes 清單中主題旁的垃圾桶圖示。已刪除的主題不會再出現在主題選單中。但已使用該主題的畫面會保留其外觀，因此畫布上的內容不會改變。
你組織中除 Guest（訪客）以外的所有人，都可以編輯與刪除主題。

​
將色彩與圓角連結到主題

色彩與圓角可以指向主題權杖，而不是固定值。連結的值會跟隨畫面的主題。因此，當主題變更時（切換到不同主題、發布編輯，或在淺色與深色之間切換），連結的色彩與圓角也會隨之更新。 色彩：在 Fill 或 Border 面板中，點擊色票。在 Token 分頁中，搜尋或從 Theme、Base 或 Tailwind 群組中選擇權杖。若需要精確的顏色，請使用 Custom 分頁。已連結的色彩會在面板中顯示其權杖名稱，而你仍可調整其不透明度。 圓角：在 Corners 面板中，點擊圓角預覽。在 Token 分頁中選擇一個級距（例如 md 或 lg）。在 Custom 分頁中，輸入以像素為單位的精確值。已連結的圓角會顯示其權杖名稱，變更主題的圓角設定時，它也會隨之重新調整。 若要將已連結的值轉回固定值，請點擊 Detach from token。該色彩或圓角會保留目前的外觀，但不再跟隨主題。

​
注意事項

  • 畫面保留各自的主題：每個畫面都會記住自己的主題與外觀。變更檔案的主題只會影響你接下來產生的畫面。若要重新套用既有畫面的樣式，請使用各畫面的 Theme 選單。
  • 僅顯示已發布版本：畫面會顯示主題的已發布版本。草稿只會在主題編輯器中可見，直到你發布為止。
  • 權杖連結在編輯後仍會保留：Flowstep 編輯或重新產生畫面時，陰影、濾鏡與漸層中使用的主題色彩，仍會與主題保持連結。
  • 不會隨主題縮放的圓角級距：none 與 full 圓角權杖永遠分別是直角與完全圓角，不受主題的圓角設定影響。