How It Works
This app trains a neural network to decide whether black or white text is more readable on any background color. Everything runs in your browser.
The Simple Version
Some background colors clearly need white text, and others clearly need black. But many colors fall in a grey area where the best choice is not obvious, even to people. This app lets a neural network learn the answer from your preferences.
1. You provide examples
The app shows you a random background color with two options: black text and white text. You pick whichever one looks more readable. Each choice becomes a training example that the model will learn from.
2. The model trains on your choices
Once you have enough examples, the app feeds them into a neural network. It processes your choices over many rounds, gradually learning the relationship between a color and which text works best on it.
3. It predicts new colors
After training, pick any color and the model will predict whether to use black or white text. The more varied your training examples, the better it handles edge cases.
Under the Hood
Neural network architecture
The model is a feedforward neural networkA type of neural network where data flows in one direction, from input to output, with no loops or cycles. built with Brain.js, a JavaScript library for GPU-accelerated neural networks that runs entirely in the browser.
The network has three input neurons, one for each color channel (red, green, blue), with values normalizedScaling values to a standard range (here 0 to 1) so the network can process them consistently. For example, an RGB value of 255 becomes 1. to a 0-1 range. It uses two hidden layersLayers between input and output that detect patterns in the data. They are called 'hidden' because their values are not directly visible as inputs or outputs. that allow it to learn non-linear relationships between color values and readability. The output layer produces a score for two labels: dark (the background is dark, use white text) and light (the background is light, use black text).
0-1
0-1
0-1
dark
light
Color values flow left to right. The hidden layers are where the network learns which combinations of red, green, and blue correspond to needing light or dark text. Each node applies a weighted calculation to its inputs and passes the result forward.
Training process
Each of your choices is stored as a mapping from an RGB color to a label. When training begins, the network uses backpropagationThe core learning algorithm. It calculates how much each weight contributed to the error, then adjusts them to reduce that error. to adjust its internal weights across many iterations, minimizing the error between its predictions and your labels.
Backpropagation works by running each training example through the network, comparing the output to the expected label, then propagating the error backwards through the layers to adjust weights. This is repeated across all examples for every iteration.
Three presets control the iteration count: Quick (100), Balanced (1,000), and Thorough (5,000). Higher iteration counts take longer but can improve accuracy, especially with larger or more diverse training sets. However, too many iterations on a small dataset can lead to overfittingWhen a model performs well on training data but poorly on new data, because it memorized specific examples instead of learning general rules., where the model memorizes the training data rather than learning general patterns.
Prediction
To predict, the network runs a forward passPassing input data through the network layer by layer, from input to output, to produce a prediction. No learning happens during this step. on the input color and produces a score between 0 and 1 for each label. The label with the higher score becomes the recommendation. For example, if the network outputs dark: 0.92 and light: 0.08, it recommends white text.
Prediction quality depends entirely on your training data. A model trained on a diverse set of colors across the full spectrum will handle edge cases better than one trained on only a handful of examples. After training, the app shows a fit rating (Excellent, Good, Fair, or Poor) based on the final training loss and the number of examples you provided.
Privacy and storage
All training and prediction happens in the browser using JavaScript. No data is sent to any server. Your training examples and the resulting model weights never leave your device.
Trained models are serialized to JSON and saved in localStorage, with up to five slots for model history. Each saved model stores the network weights, the number of training examples used, and a timestamp, so you can compare models trained with different data or presets.