品牌配色搭配器

從商品圖片擷取顏色，調整五色色卡，即時預覽簡單商品廣告。

圖片僅在瀏覽器本機處理，無需上傳或消耗生成點數。

1. 選擇商品圖片

SEREIN 是虛構概念品牌。示例顏色從商品照片實際擷取。

2. 調整五種顏色

變更用途會交換對應的兩種顏色。

#B87520

用途

#F3EBDD

用途

#D9AD69

用途

#30251E

用途

#8B7159

用途

即時配色預覽

精選系列

日常的一點美好

選擇圖片以預覽商品。

為下一次創作試試這組配色。

文字 / 背景對比度 12.59:1

AA：一般文字可用。

AA 標準：一般文字 4.5:1，大字 3:1。僅檢查所選文字色與背景色。

查看 / 手動複製 CSS

:root {
  --brand-primary: #B87520;
  --brand-background: #F3EBDD;
  --brand-accent: #D9AD69;
  --brand-text: #30251E;
  --brand-secondary: #8B7159;
}

將配色用於下次創作：開啟畫布