> ## Documentation Index
> Fetch the complete documentation index at: https://docs.agencyhandy.com/llms.txt
> Use this file to discover all available pages before exploring further.

# 自訂您的 AgencyHandy 工作區色彩配置

> 將您的品牌色彩套用至 AgencyHandy 側邊欄和介面——主色、背景、文字和懸停狀態——所有用戶即時可見。

外觀設定讓您完全掌控 AgencyHandy 工作區的視覺呈現。您可以透過自訂主色、側邊欄背景、側邊欄文字顏色以及側邊欄導覽項目的懸停高亮色，使平台的色彩配置與您代理商的品牌形象保持一致。每次儲存的變更都會立即在整個工作區中對所有用戶生效——無需重新整理頁面。

<Note>
  只有**超級管理員**和**管理員**才能存取和修改外觀設定。如果您在**工作區設定**下看不到此選項，請請您的超級管理員審查您的角色。
</Note>

## 存取外觀設定

<Steps>
  <Step title="開啟工作區設定">
    從左側導覽選單，點擊**工作區設定**。
  </Step>

  <Step title="選擇外觀">
    從子選單中點擊**外觀**（有時標記為**視覺設定**）。
  </Step>
</Steps>

***

## 自訂每個視覺元素

### 主色

主色套用於整個平台的按鈕、有效連結、高亮狀態和關鍵介面元素。

* 選擇能反映您核心品牌形象的顏色。
* 這是影響最大的色彩設定，因為它在整個 UI 中隨處可見。

### 側邊欄背景色

側邊欄背景設定左側導覽面板的基底色調。

* 使用能在側邊欄和主內容區域之間形成清晰視覺區隔的顏色。
* 深色背景搭配淺色文字通常可讀性最佳。

### 側邊欄文字顏色

側邊欄文字顏色控制左側選單中所有導覽項目的標籤顏色。

* 請始終選擇與側邊欄背景色對比強烈的顏色。
* 對比度不足會使連結更難閱讀並降低可及性。

### 側邊欄懸停背景色

當用戶將游標移至側邊欄導覽項目上時，此顏色會顯示為背景高亮。

* 它能傳遞互動性，幫助用戶了解即將點擊的項目。
* 選擇與預設側邊欄背景和有效項目顏色都明顯不同的顏色。

***

## 套用您的色彩選擇

<Steps>
  <Step title="開啟每個欄位的色彩選擇器">
    點擊四個外觀欄位（主色、側邊欄背景、側邊欄文字顏色或側邊欄懸停背景色）旁邊的色彩色塊，以開啟色彩選擇器。
  </Step>

  <Step title="輸入十六進位色碼或選取顏色">
    直接在輸入欄位中輸入您品牌的確切十六進位色碼（例如：`#3B5BDB`），或使用視覺選擇器選擇色調。
  </Step>

  <Step title="預覽變更">
    在儲存之前，查看更新後的顏色在側邊欄和整個介面中的呈現效果。
  </Step>

  <Step title="點擊「儲存變更」">
    當您對結果滿意時，點擊**儲存變更**。更新後的外觀將立即全域套用到工作區中的所有用戶。
  </Step>
</Steps>

<Tip>
  將您品牌的十六進位色碼記錄在易於存取的地方（品牌風格指南或筆記檔案）。您會希望一致地重複使用完全相同的數值——尤其是當您需要重設和重新設定外觀設定時。
</Tip>

***

## 重設為預設佈景主題

如果您想移除所有自訂品牌並恢復原始的 AgencyHandy 色彩配置，請點擊外觀頁面上的**重設預設設定**按鈕。

<Warning>
  重設為預設值會永久捨棄所有自訂色彩變更。此操作無法復原。如果您想保留目前的設定，請在重設前記下您的十六進位色碼。
</Warning>

***

## 色彩對比最佳做法

良好的色彩對比不只是設計偏好——它直接影響團隊和客戶的可讀性和可及性。

<CardGroup cols={2}>
  <Card title="達到 WCAG AA 對比比例" icon="eye">
    對於一般正文，文字和背景之間的對比比例至少應為 **4.5:1**。對於大型文字或圖示，**3:1** 的比例是可接受的。使用 [WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/) 等工具進行驗證。
  </Card>

  <Card title="避免低對比組合" icon="triangle-exclamation">
    不要將淺灰色文字放在白色背景上，或將黃色文字放在白色背景上——這些組合無法通過可及性標準，並且在長時間工作後會使眼睛疲勞。
  </Card>

  <Card title="有意識地測試懸停狀態" icon="arrow-pointer">
    懸停顏色應與靜止狀態和有效狀態明顯不同。如果它們看起來相同，用戶將失去重要的視覺回饋。
  </Card>

  <Card title="與品牌保持一致" icon="paintbrush">
    在這裡使用與您的網站、提案和發票上相同的主色。一致性能在所有客戶接觸點建立認知度和專業形象。
  </Card>
</CardGroup>

***

## 重要注意事項

* **即時全域生效：** 所有已儲存的外觀變更會立即套用到整個工作區。每位已登入的用戶在下一次導覽操作時即可看到更新。
* **單一有效佈景主題：** 不支援多佈景主題——整個工作區的所有角色共用同一套色彩設定。
* **角色限制：** 只有超級管理員和管理員才能進行外觀變更。一般團隊成員和客戶無法修改顏色。
* **重設是永久的：** **重設預設設定**按鈕的操作無法復原，因此只有在您有意移除所有自訂色彩時才使用它。