Skip to content
Lizely

RGB Guessing Game

Identify five mystery sRGB swatches by typed RGB or HEX estimates, with explicit channel-error thresholds and an exact 1,000-point perfect run.

Privacy: your files never leave your device. All processing happens locally in your browser.

How to use

  1. 1.Study the current Canvas swatch, choose decimal RGB or CSS HEX input, and enter three 0-255 channels or #RGB/#RRGGBB.
  2. 2.Submit the estimate; every channel error must be at most 12 and the three errors together must total at most 24.
  3. 3.Identify all five swatches for 200 points each before two distinct wrong colors lock a round, producing an exact perfect score of 1,000.

About RGB Guessing Game

RGB Guessing Game is a five-round numeric color-recognition challenge. Instead of moving color-mixing sliders, you study one displayed swatch and type an estimate in either decimal RGB or hexadecimal form. The active swatch is drawn into a Canvas so the visible page text, ARIA label, data attributes, and inline style do not publish its exact answer. As with any client-side visual game, a determined user can sample displayed pixels or inspect downloaded code; the interface prevents accidental answer disclosure rather than claiming tamper resistance.

RGB mode accepts three base-10 whole numbers from 0 through 255. HEX mode accepts the CSS forms #RGB or #RRGGBB, including the leading hash, with case-insensitive hexadecimal digits. Three-digit notation duplicates each digit, so #ABC expands to #AABBCC. Both formats are converted to the same red, green, and blue integer tuple before scoring and attempt deduplication.

For each channel, the game calculates absolute error: |target red minus guessed red|, |target green minus guessed green|, and |target blue minus guessed blue|. A guess passes only when every channel error is no more than 12 and the sum of all three errors is no more than 24. Both inclusive limits must pass. This dual threshold prevents one large channel mistake from being hidden by two exact channels while still allowing a small visual estimation margin.

A successful swatch awards exactly 200 points and opens the next fixed round. Five successful rounds therefore produce exactly 1,000 points. The current feedback reports all three channel errors, the largest channel error, and the total error. The exact target tuple remains absent from normal answer feedback during play. Future round values are not rendered into the current DOM.

The first distinct wrong normalized color leaves one repair attempt. Repeating the same color does not consume the second chance, even when the first entry used decimal RGB and the repeat used an equivalent HEX code. A second different wrong color locks the round until Restart. Invalid syntax, missing channels, fractions, negative values, values above 255, deadlocked states, and completed states do not alter the business state.

Use Tab to move between the native format buttons, fields, and submit action, and press Enter from the form to check an estimate. Each input and action keeps a mobile-friendly touch height, and the layout becomes a single column on a narrow screen. Completion and deadlock move focus to a terminal status message. While the shared Boss overlay is visible, input edits, mode changes, submission, and Restart all return without changing local or scored state.

The parser and evidence package follow the W3C CSS Color Module Level 4 hexadecimal notation rules. MDN independently cross-checks the three- and six-digit forms, digit duplication, case behavior, and the 0-to-255 integer RGB range. Eight external literal golden cases cover black, white, primaries, shorthand, mixed channels, and two authored round colors. The test oracle stores expected integer tuples directly and never calls the production parser to manufacture its expected values.

Five additional independent literal fixtures verify every authored round, and exhaustive boundary checks cover the dual error condition. Tests also verify cross-format deduplication, the second-distinct-miss lock, deterministic Restart, exact 1,000-point completion, terminal no-ops, Boss guards, the absence of future-answer rendering, and the absence of typed-recognition-to-slider drift. All gameplay and best-score handling remain in the browser with no upload, account, model call, remote color service, or new dependency.

Methodology & sources

Parse either three decimal integer channels in [0,255] or CSS #RGB/#RRGGBB notation, expanding each short-form digit and normalizing both modes to one RGB tuple. Compare that tuple with the active literal target using three absolute channel errors. Accept only if max(error) <= 12 and sum(error) <= 24, award 200, and complete five rounds at exactly 1,000. Canonicalize the tuple for cross-format miss deduplication, deadlock on the second distinct miss, and keep terminal states atomic. Canvas displays the active color without publishing the exact target in normal DOM text or attributes.

Frequently asked questions

How close does an RGB guess need to be?
Every absolute channel error must be 12 or less, and the sum of the red, green, and blue errors must be 24 or less. Both inclusive conditions are required.
Can I answer with either RGB or HEX?
Yes. Decimal RGB and #RGB or #RRGGBB are normalized to the same three integer channels, so equivalent entries also share one miss signature.
Is this the same as the Color Mixing Game?
No. This game is typed numeric recognition of a displayed swatch. Color Mixing Game uses adjustable additive or idealized subtractive controls and Delta E color matching.

Related tools

Mini Games guides

View all