
免費 RGB 猜測遊戲的功能
免費的 RGB 猜測遊戲要求你輸入十進位 RGB 色頻數值或 CSS 十六進位色碼,以辨識五個未知 sRGB 色塊,每個色頻的誤差上限為 12,三個色頻的總誤差上限為 24,達標即可獲得滿分 1,000 分。
大多數為瀏覽器設計的免費色彩猜測遊戲可以歸入兩類。第一類要求你目測色塊,並從一小組具名色彩中選出最接近的顏色;第二類則提供滑桿,讓你透過反覆嘗試自行調配至目標顏色。RGB 猜測遊戲則採取第三種方式。它會在 Canvas 上繪製一個未知顏色,要求你輸入數值預估——可以是三個整數或一段十六進位字串——說明你認為該顏色為何。遊戲接著會依據嚴格且透明的評分標準為你的預估打分數。
這是一個辨識挑戰而非調色挑戰,而這個區別至關重要。你並非在調整加法或減法控制項;而是閱讀一個靜態色塊並提出數值答案。挑戰共橫跨五個固定回合,每個回合都有自己的目標色塊。回合成功與否是二元的:只有當每個色頻的誤差皆不超過 12,且三個色頻的誤差總和不超過 24 時,遊戲才會接受你的猜測。這兩個含上限必須同時通過。當回合通過時,你會獲得剛好 200 分並進入下一個色塊。因此五個乾淨的回合會剛好累積至 1,000 分。
如何進行一輪免費色彩猜測遊戲
每個回合都遵循相同的三步驟模式。介面精簡且支援滑鼠、觸控或全鍵盤輸入,因此你可以在筆記型電腦或手機上以同樣的方式遊玩。
- 觀察目前的 Canvas 色塊,選擇十進位 RGB 或 CSS HEX 輸入,然後輸入三個 0-255 的色頻值,或一段 #RGB 或 #RRGGBB 字串。HEX 模式同時接受簡寫與完整六位數標記法,且解析器會展開三位數簡寫,因此 #ABC 會變成與 #AABBCC 相同的顏色。
- 提交預估值。遊戲會將兩種格式轉換為相同的紅、綠、藍整數元組,然後檢查雙重閾值:每個色頻的絕對誤差必須小於或等於 12,且三個色頻誤差的總和必須小於或等於 24。
- 若你的猜測通過,便獲得 200 分並出現下一個色塊。依序辨識全部五個色塊即可達成滿分 1,000 分的挑戰。若你的猜測是第一個不同的錯誤顏色,你仍保有一次修正機會;第二個不同的錯誤顏色則會鎖定該回合,直到你重新開始。
回合流程刻意簡短。沒有計時器、提示按鈕,也不會因謹慎猜測而扣分。在輸入預估值之前,你可以花任意時間觀察色塊。一旦提交,意見回饋面板會顯示三個色頻誤差、最大單一誤差以及總誤差,因此你能清楚知道每次猜測的差距。目標元組本身在遊玩過程中不會出現在答案回饋中,這表示唯一得知精確值的方法就是讓猜測足夠接近,進而讓回合通過。
免費色彩猜測遊戲中的 RGB 與 HEX 輸入
兩種輸入格式會產生相同的分數,因為遊戲在進行任何比較之前會先將其標準化為單一整數元組。下表概述每種格式的解析方式,並附上遵循 W3C CSS 色彩模組 Level 4 規則的範例。
| 面向 | 十進位 RGB | CSS HEX |
|---|---|---|
| 格式 | 三個以 10 為基底的整數(每個色頻 0-255) | #RGB 或 #RRGGBB,帶有前置井字號 |
| 色頻範圍 | 每個色頻包含 0 至 255 | 每個色頻 00 至 FF(十六進位) |
| 簡寫支援 | 不適用 | 支援 — #ABC 展開為 #AABBCC |
| 大小寫敏感性 | 僅限整數 | 不區分大小寫;#abc 等於 #ABC |
| 有效輸入範例 | 120 200 64 | #78C840 |
| 標準化為 | (120, 200, 64) | (120, 200, 64) |
| 標記法權威來源 | MDN rgb() 參考文件 | W3C CSS 色彩模組 Level 4 |
因為標準化發生在計分之前,所以在錯誤追蹤中,RGB 預估值與其對應的 HEX 表示會被視為相同的猜測。如果你首次以十進位輸入 (120, 200, 64),接著提交 #78C840 作為修正嘗試,遊戲會將其視為相同顏色,且不會消耗你的第二次機會。錯誤計數僅會在出現真正不同的標準化元組時才會推進,這能保護你不會在回合中途切換格式時意外造成雙重處罰。
透過色頻回饋調整下一次猜測
每次提交後出現的回饋面板是本遊戲學習循環的核心。它並非告訴你猜測是接近或遠離,而是回報關於你上一次猜測的四項數值事實:紅色色頻的絕對誤差、綠色色頻的絕對誤差、藍色色頻的絕對誤差,以及這三者中的最大值。一行總誤差摘要則彙整三項誤差。
利用逐色頻細節決定要調整的方向。若綠色色頻顯示最大的誤差,表示該色塊的綠色可能比你的預估值多或少。若兩個色頻完全正確而其中一個為 13 或 14,則雙重閾值會因為單一超支的色頻而未通過,即使總誤差遠低於 24。12 的單色頻上限正是為了防止單一重大錯誤被兩個完美色頻掩蓋。針對目標 (245, 0, 0) 猜測 (255, 0, 0) 的總誤差為 10,看似可接受,但 10 單位的紅色誤差落在 12 的色頻上限內,因此回合通過。針對 (240, 0, 0) 猜測 (255, 0, 0) 的總誤差為 15,單一色頻誤差為 15,即使總誤差遠低於 24,回合仍會因單色頻規則而失敗。兩項檢查皆重要,且遊戲會一併套用。
當你處於閾值內時,回合結束並出現下一個色塊。當你超出閾值時,誤差數字會留在螢幕上,方便你在修正嘗試時加以運用。Canvas 色塊在修正期間也會持續顯示,因此你能在重新輸入數值時,持續將心中的預估值與所呈現的顏色進行比較。
滿分 1,000 分是如何組成的
分數是整個設計中最容易理解、卻也最嚴格的部分。每通過一個色塊剛好獲得 200 分,且剛好有五個回合。沒有「回合內首次猜測即通過」的加分、沒有時間獎勵,也不會因使用修正機會而扣分——第二個不同的錯誤顏色只會鎖定該回合,直到你重新開始整場遊戲。
這種結構意味著完美挑戰只有兩種結果:依序通過全部五個回合以取得剛好 1,000 分的成績,或者在途中鎖定某個回合,挑戰以你目前已累積的分數作收。沒有中間地帶。鎖定回合時不給予部分分數的設計,正是讓 1,000 分目標維持精確而非概略的原因。遊戲不會將未來回合的值洩漏到目前的 DOM 中,因此你無法預先窺探接下來的目標來規劃預估值。
若讀者希望深入了解評分細節,包括雙重閾值如何與不同的誤差分布互動,以及如何在五個回合中妥善分配修正機會,請參閱 RGB 與 HEX 評分完整攻略,內文詳細說明通往 1,000 分滿分成績的途徑。
免費瀏覽器遊玩:無需安裝任何東西
這款免費色彩猜測遊戲之所以能如此乾淨地歸類為「在瀏覽器中玩」類型,一個實際的原因就是所有功能皆在本地端執行。無需下載、無需註冊、無需帳號、無需遠端色彩服務,也無需呼叫模型。Canvas 繪製作用中的色塊、解析器處理你的輸入、比較器計算色頻誤差、分數累積——這一切都在你的瀏覽器分頁內完成。你可以關閉分頁,稍後再開啟,重新開始一輪五回合的挑戰,而除了本機最佳成績外,不會遺失任何持續性狀態。
介面同樣刻意兼顧可攜性。你可以使用 Tab 在格式按鈕、輸入欄位與提交動作之間移動,也可以在表單中按下 Enter 鍵來檢查預估值。觸控目標維持在適合行動裝置的高度,版面配置會在窄螢幕上自動收合為單欄,因此同一款遊戲在筆記型電腦、平板電腦與手機上都能運作,且不會遺失任何逐色頻回饋。若你想在遊玩前自行驗證標記法規則,MDN 的 hex-color 參考文件 記錄了本遊戲所使用的相同簡寫展開與大小寫行為。
由於作用中的顏色僅出現在 Canvas 中,可見的頁面文字、ARIA 標籤、資料屬性與行內樣式在正常遊玩過程中並不會公開精確答案。與任何用戶端視覺遊戲相同,執意嘗試的使用者仍能擷取顯示的像素或檢查下載的程式碼,因此介面的設計目的是防止意外洩漏目標,而非聲稱具備防竄改能力。對一般遊玩而言,這已足以讓全部五個回合的辨識挑戰保持公平。
若想深入了解,請參閱 兒童影子配對:五個原創物件配對遊戲。