Skip to content
Lizely

Color Mixing Game

Match five colors with additive RGB and disclosed idealized CMY controls using real Delta E 1976 scoring.

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

How to use

  1. 1.Read the mode, target hex value, and target Lab numbers, then compare them with the current mix shown beside the target.
  2. 2.Adjust the three RGB 0–255 or idealized CMY 0–100 sliders with touch, mouse, or native keyboard arrow controls.
  3. 3.Press Check mix and reach Delta E 1976 of 3.0 or lower; avoid two distinct misses, then complete all five targets for 1,000 points.

About Color Mixing Game

Color Mixing Game is a five-round color-matching challenge that teaches two deliberately different models. Additive RGB rounds treat the controls as red, green, and blue display-light channels from 0 to 255. Raising a channel adds more of that encoded sRGB component. Idealized subtractive CMY rounds use cyan, magenta, and yellow controls from 0% to 100%. In this simplified teaching model, each control removes its complementary display channel: cyan removes red, magenta removes green, and yellow removes blue. This CMY calculation is explicitly not a prediction of real paint, printing ink, paper, lighting, binders, or pigment chemistry. Physical mixtures can behave differently because their spectral properties are not represented here.

Every round shows more than two color patches. The target and current mix are identified by hexadecimal sRGB values, current RGB channel numbers, the active model name, and CIELAB coordinates. These text and numeric cues make the state understandable even when two colors look similar, a display is not calibrated, or color perception differs between players. Three large range inputs provide native keyboard control: focus one with Tab, then use the arrow keys to make precise one-unit adjustments. Touch users receive the same three controls with at least a 44-pixel interaction height.

Scoring uses a real color-science conversion chain rather than an RGB shortcut. Each encoded sRGB channel is normalized and decoded to linear light with the standard piecewise sRGB transfer function. The linear triplet is multiplied by the published linear-sRGB to XYZ matrix for the D65 illuminant. XYZ is then normalized against the D65 white point and transformed into CIELAB coordinates with the standard epsilon and kappa branches. Finally, Delta E 1976 is calculated as the Euclidean distance between the two Lab triplets: the square root of the summed squared differences in L, a, and b. RGB channel distance is never labeled or used as Delta E.

A mix is close enough when its Delta E 1976 value is 3.0 or lower. Press Check mix to evaluate the current controls. A correct match immediately awards 200 points and opens the next fixed target. Five completed rounds therefore produce an exact score of 1,000. The target sequence combines RGB and idealized CMY tasks: Signal Orange, Ideal Green, Electric Cyan, Ideal Violet, and Screen Magenta. Their exact slider solutions and expected Lab values are independently recomputed in the test suite from literal fixtures.

The game gives each round a strict two-miss structure. The first distinct wrong mix records its Delta E and leaves one chance. Checking the exact same wrong slider signature again is deduplicated and does not consume the second chance. A second different wrong signature locks the round. Once locked, all three sliders and the Check button are disabled so the score and attempt history cannot drift. Restart is the only recovery path and restores the same deterministic first target, zeroed sliders, zero score, and empty signature set. Invalid arrays, missing channels, fractional slider values, NaN, values outside the active mode range, deadlocked states, and completed states are atomic no-ops.

The five solutions are fixed, inspectable fixtures rather than generated guesses. RGB solutions map directly to their sRGB channels. CMY solutions apply the disclosed ideal complement rule and round each resulting display channel to an integer. An independent test oracle implements its own sRGB decoding, rational XYZ D65 matrix, D65 white normalization, Lab transform, and Delta E formula. It does not call the product conversion functions to generate expected answers. The oracle checks black, white, all three sRGB primaries, and cyan, magenta, and yellow as eight external golden cases. It also verifies each target solution, expected hexadecimal value, expected Lab coordinates, near-zero solution Delta E, scoring increments, duplicate-signature behavior, the second-distinct-miss lock, atomic invalid inputs, and deterministic Restart.

The calculation references the W3C CSS Color Module Level 4 conversion code as its primary algorithm source. The International Color Consortium sRGB registry independently cross-checks the IEC sRGB definition, the 2.4 transfer exponent, and D65 chromaticity coordinates. Both reference pages were fetched successfully when this tool was prepared. The game itself runs entirely in your browser as a client-side L1 experience. Slider values, attempts, color conversions, and scores are not uploaded for processing, and no account is required. The shared game shell also provides Restart, best-score handling on this device, and the Boss control.

Methodology & sources

Encoded sRGB channels use the W3C piecewise transfer function, then the published rational sRGB-to-XYZ D65 matrix. XYZ is normalized by D65 (x=0.3127, y=0.3290), transformed to CIELAB with epsilon 216/24389 and kappa 24389/27, and compared using Delta E 1976: sqrt((L1-L2)^2+(a1-a2)^2+(b1-b2)^2). The acceptance threshold is Delta E <= 3.0. CMY is disclosed as idealized channel complementation, not physical pigment simulation.

Frequently asked questions

Related tools

Mini Games guides

View all