Android 上的配色產生器可以直接從手機的瀏覽器運作——不需要 APK、不需要從 Play 商店安裝、不需要帳號，也不會有任何東西上傳到伺服器。你只要在 Chrome（或任何現代的 Android 瀏覽器）中開啟這個工具，挑選一個基準色，再從六種色輪配色中選擇一種，網頁就會立刻回傳一組搭配好的色票，並提供 HEX、RGB 與 HSL 數值，只要輕點一下就能複製。整個功能是以 HSL 色彩空間的色相旋轉為基礎，這也是設計師數十年來一直在使用的色彩理論關係，所以你在手機螢幕上得到的配色，跟你用紙筆畫出來的規則完全一樣。由於所有運算都是透過用戶端的 JavaScript 在瀏覽器中執行，你產生的色彩永遠不會離開你的裝置。
為什麼瀏覽器工具比在 Android 上多裝一個 App 來得好
Play 商店上大多數的「配色產生器」App 做的事情，其實和 配色產生器 在瀏覽器中做的事一模一樣——讓你挑選一個基準色，然後吐出幾組和諧的色票。差別在於摩擦力。原生 APK 會要求你下載檔案、授予儲存權限、接受廣告，有時候還要你先登入才會顯示任何色票。基於瀏覽器的產生器則完全跳過這些步驟：你點一下書籤，網頁載入，你就已經看到一組配色了。
瀏覽器工具也比較能跟上時代。互補、類似、三等分、四等分、分裂互補以及單色等配色方案背後的色彩理論數學，自從基本色輪被正式確立以來就沒有變過，而網頁工具可以在從你抽屜裡最舊的 KitKat 手機到最新的 Pixel 等每一個 Android 版本上，保持這套公式完全一致。相較之下，APK 在開發者轉身離開的那一天就停止更新了，這也是為什麼 Play 商店上許多「免費配色 App」多年都沒有更新的原因。
還有一個值得一提的隱私面向。由於產生器是在你的瀏覽器中本地執行，沒有東西需要上傳，也沒有分析 SDK 在追蹤你每一個點選的色票。你可以在火車上、咖啡廳裡或飛機上，為客戶的品牌配色打草稿，完全不用擔心這些色彩被存到哪裡、誰能看到。
你可以在 Android 上產生的六種配色方案
你建立的每一組配色，都從一個基準色和一種直接取自色輪的關係開始。數學運算是在 HSL 色彩空間中進行，色相是一個 0–360° 的圓，所以不管你從哪個基準開始，色彩之間的關係都保持可預測。
| 方案 | 相對於基準色的色相旋轉 | 視覺效果 | 最適合用途 |
|---|---|---|---|
| 互補色 | +180° | 兩個高對比的色彩 | 行動呼籲按鈕、強調文字 |
| 類似色 | ±30° | 平靜、協調的鄰近色 | 背景、主視覺區塊、情緒板 |
| 三等分配色 | ±120° | 平衡、鮮明的三色組合 | 插圖、活潑的 UI、行銷圖像 |
| 四等分配色 | ±90°（兩組配對） | 豐富、多樣化的四色組合 | 儀表板、資料視覺化 |
| 分裂互補色 | 180° ±30° | 柔和對比，無緊張感 | 圖片上的標題、編輯型版面 |
| 單色配色 | 色相固定，明度分段 | 乾淨的色階 | 陰影、邊框、懸停狀態、層次感 |
使用 HSL 而非原始 RGB 的原因，在於 HSL 將色相與飽和度、明度分離開來。旋轉色相能保持配色的整體氛圍，同時讓關係維持可預測，這正是你伸長手臂在滑手機、需要在瞬間判斷兩個色票「搭不搭」時所想要的。關於這些關係最初是如何被描述的更深入背景，維基百科的「色彩理論」條目是個很好的起點。
如何在你的 Android 手機上產生配色
- 開啟你的 Android 瀏覽器——Chrome、Samsung Internet、Firefox 或 Brave——然後載入配色產生器。
- 點選基準色色票以開啟選色器，或直接輸入 HEX 值，例如 #3b82f6（如果你已經有品牌色）。
- 從選單中選擇一個方案：互補、類似、三等分、四等分、分裂互補或單色。配色的更新在你點選的那一刻就會發生。
- 閱讀顯示在每個色票下方的 HEX、RGB 和 HSL 數值，這樣你才能取得你的設計工具實際支援的格式。
- 點選任何你喜歡的色票，就能把它的 HEX 複製到剪貼簿。
- 切換不同方案以比較選項，然後把儲存的 HEX 值貼回你筆電上的 CSS、Figma 檔案或樣式指南。
操作流程與桌面版本完全相同。
一個快速的色相旋轉範例
由於每個方案都只是在 0–360° 色相圓上做旋轉並正確處理循環，你甚至可以在打開工具之前就預測它會產生什麼。以任何一組互補色的公式為例：
new_hue = (base_hue + 180) mod 360
如果你的基準色色相位於 350°（偏粉紅的紅色），那麼互補色相就是 (350 + 180) mod 360 = 530 mod 360 = 170°——一種與原本色彩形成強烈對比的青綠色調。「mod 360」這部分就是讓數學在色輪接縫處依然正確的循環處理：350° 的色相加上 30° 會落在 20°，而不是 380°，這也是時鐘在 12:55 之後會指向 1:00 的同一個道理。正是這個特性，讓每一種配色方案無論基準色落在色輪的哪個位置都保持可預測，也正是這個原因，即使你的基準色正好在光譜的邊緣，產生器也能產出穩定的配色。
Android 設計師的實務工作流程
在手機上使用這個工具最快的方式，就是把它當作速寫本。挑一個品牌色，截圖整組配色，然後在會議中對客戶的 logo 反覆調整。一個常見的模式是：先從你的主要品牌色開始，產生一組互補色或三等分配色作為強調文字與圖示，再切換到單色方案，萃取出你在懸停狀態、邊框和高度層次中會需要的較淺與較深的色階。
另一個在小螢幕上很有效的模式是做情緒板。輸入一張你剛拍的照片中的 HEX——夕陽、布料樣片、漆卡——類似色方案就會給你已經藏在這張圖片裡的支援色。你可以在不離開相機膠捲的情況下，不到一分鐘就建立整組配色。
如果你是在手機上做原型，然後再把工作搬回電腦，那就在當下找到喜歡的 HEX 時立刻複製。手機上的瀏覽器工作階段不見得都撐得過分頁清理，而且因為沒有自動儲存功能，剪貼簿就是你的安全網。許多設計師會直接把清單貼到 Keep 筆記或傳給自己的 Telegram 訊息，這樣回到筆電時，色彩就在那裡了。
出貨前別忘了檢查對比度
一組和諧的配色並不自動等於無障礙的配色。兩個「看起來順眼」的色票，在一個作為文字疊在另一個上面時，仍可能達不到 WCAG 對比度最低要求，特別是在手機上，眩光和低亮度會讓原本就偏弱的對比更難閱讀。在你把一組配色定稿到實際介面之前，請先用 色彩對比度檢查工具 跑一次文字與背景的配對，確認比值符合 AA（內文文字為 4.5:1）或 AAA（7:1）標準。
同樣的建議特別適用於單色方案。平均地分段明度，可能產生在色票表上看起來很美、但當其中一個被當作佔位背景、另一個被當作上面的文字時卻崩盤的色階。請測試實際的配對，而不僅僅是獨立的色彩，並記得對比度要求也適用於表單邊框和圖示等 UI 元素，不僅僅是長篇文字。
瀏覽器 vs Android App：它們有何不同
| 面向 | 瀏覽器型產生器 | 原生 Android App |
|---|---|---|
| 安裝大小 | 無——僅需書籤 | 數 MB 的 APK 儲存空間 |
| 更新 | 每次載入都是最新版本 | 僅在開發者推送更新時才更新 |
| 權限 | 無需任何權限 | 儲存權限，有時還包括網路，有時還有廣告 SDK |
| 離線使用 | 在瀏覽器中執行，無需安裝 | 通常可完全離線運作 |
| 隱私 | 留在裝置上 | 取決於開發者 |
| 色彩格式 | HEX、RGB、HSL 並可複製 | 因 App 而異；有些格式被鎖在付費牆後 |
取捨主要在於安裝摩擦。如果你只需要一次配色而且現在就要，瀏覽器的路線更快，因為沒有 App 要下載、不用授予權限，也不用完成註冊。
如需更深入的說明，請參閱 Android 上的 CMYK 色表：使用瀏覽器查詢。