> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://support.easystore.co/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# 【官網設計】關於佈景主題設定的顏色對應位置（Aroma 或其後發佈之佈景主題）

若你使用新版主題（Aroma 或其後發佈之佈景主題），你可參考這篇關於佈景主題設定裡顏色設定所對應的位置。此篇文章是以佈景主題 Muse 作為範例。

---

# ${color}[#a41313](目錄：)

### [一般內文顏色](#1-5lia6iis5ywn5pah6agp6imy)

### [背景顏色](#1-6iom5pmv6agp6imy)

### [按鈕顏色](#1-5oyj6yiv6agp6imy)

### [按鈕字色](#1-5oyj6yiv5a2x6imy)

### [外框型按鈕色](#1-5asw5qgg5z6l5oyj6yiv6imy)

### [產品背景顏色](#1-55si5zob6iom5pmv6agp6imy)

---

### 🛣️ 路徑：EasyStore 後台 → 品牌官網 → 佈景主題設定 → 設定 → 顏色

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_dkeoij.png)


---

# 一般內文顏色

基本會對應在官網的一般文字，不包括主選單和頁尾

###### 這裡會調成紅色作為例子讓你更了解什麼部分會被影響

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_vvno4v.png)

* 商品區塊/頁面的標題、商品名稱、售價

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1ab2oap.png)

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_9byvbo.png)

![](https://storage.crisp.chat/users/helpdesk/website/-/b/3/4/7/b34797d9594d3000/image_ajxdun.png)



* 登入頁面

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1ti29tq.png)

* 精選商品目錄區塊

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_14fd1sc.png)

* 分頁、部落格文章、商品描述的文字顏色也會有變化，不過你可以再到後台裡編輯這些頁面的文字顏色，即會變成你想呈現的文字顏色。或者是你在製作分頁、部落格文章、商品描述的文字時已經有調過顏色，則不會被覆蓋

如：紅框處是有客製化過文字顏色，更換佈景主題一般文字顏色時，紅框處不會被覆蓋

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_vu3jci.png)

* 售完標籤字色

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_152fju0.png)
---

# 背景顏色

* 官網背景會以你選擇的顏色呈現

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_ou4jcn.png)

* 售完標籤外框顏色

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_7k30o1.png)
---

# 按鈕顏色

對應官網的按鈕顏色，不包括一些佈景主題設定裡的區塊

###### 這裡會調成紅色作為例子讓你更了解什麼部分會被影響

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1bapfpx.png)

* 輪播圖片的按鈕顏色

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_ivop06.png)

* 商品區塊的「加入購物車」「瀏覽全部」按鈕

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1yzaseb.png)

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1iooo5i.png)

* 登入頁面

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_4zpm3o.png)

* 佈景主題設定裡的精選區塊

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1gq0m6h.png)

* 系統生成的優惠標籤外框顏色

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_rzjdsj.png)
---

# 按鈕字色

這會對應按鈕裡文字的顏色，不包括一些佈景主題設定裡的區塊

###### 這裡會調成紅色作為例子讓你更了解什麼部分會被影響

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_18te0bv.png)

* 商品區塊的「加入購物車」「瀏覽全部」按鈕

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1axkl0w.png)

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_d4sr74.png)

* 登入頁面

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_s59t5v.png)

* 佈景主題設定裡的精選區塊

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1s97enl.png)

* 系統生成的優惠標籤字色

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_47zrbb.png)
---

# 外框型按鈕色

###### 這裡會調成紅色作為例子讓你更了解什麼部分會被影響

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_9wij0y.png)

* 佈景主題設定裡的多元格框區塊按鈕

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1r8pilp.png)

* 佈景主題設定裡的部落格區塊按鈕

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1oyjrnm.png)

* 登入頁面的「忘記密碼」「註冊帳號」按鈕

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_gmunil.png)

* 註冊頁面的條款名稱連結

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_tdr1tc.png)

---
# 產品背景顏色

【精選商品目錄】和【目錄列表】的區塊可以額外設定產品的背景顏色


![](https://storage.crisp.chat/users/helpdesk/website/-/b/3/4/7/b34797d9594d3000/image_cw6qik.png)
---
💡 小提醒：

此篇文章是以 Muse 作為範例，一些其他新版主題可能會有些許顏色對應上的出入，如 Aroma、Freshbit、Marshmallow、Mels、Pastries、Brew 、Scents、Wood Essence、Craftyhands、Digitron