How It Works

Genetic Painter uses a genetic algorithm to reconstruct any image using only simple shapes. Upload a photo, click Start, and watch as thousands of randomly placed, colored shapes gradually evolve into a faithful reproduction of your image — all running directly in your browser with no server processing.

Each iteration, a random shape is painted onto the canvas with a random position, size, color, and transparency. The algorithm then compares the painting to the original image pixel by pixel within the shape's bounding area. If the new shape brings the painting closer to the original, it's kept. If not, it's immediately discarded and the canvas reverts to its previous state. Over thousands of generations, this simple process of mutation and selection produces surprisingly detailed artwork.

What is a Genetic Algorithm?

A genetic algorithm is an optimization technique inspired by biological evolution and Charles Darwin's theory of natural selection. Just as organisms in nature adapt to their environment through random genetic mutations — where beneficial traits survive and harmful ones die out — a genetic algorithm applies the same principle to solve complex problems.

The algorithm starts with a blank canvas and repeatedly applies random mutations (painting shapes). Each mutation is evaluated for "fitness" — how closely the canvas matches the target image. Mutations that improve fitness are kept (selected), while those that reduce it are discarded. Over many thousands of iterations, this relentless selection pressure drives the painting toward an increasingly accurate reproduction.

Genetic algorithms are widely used in computer science for optimization problems that are too complex for traditional approaches, including scheduling, circuit design, machine learning, and — as demonstrated here — generative art.

Choosing Shapes and Settings

Genetic Painter offers five shape modes to experiment with: circles, triangles, squares, stars, and mixed (which randomly alternates between all shapes). Each shape produces a distinctly different artistic style. Circles tend to create smooth, painterly results reminiscent of pointillism. Triangles produce angular, crystalline textures. Squares give a mosaic-like quality, while stars add a decorative, ornamental feel.

The min and max radius sliders control the size range of painted shapes. Smaller radii (1–10 px) capture fine detail but require more generations. Larger radii (20–100+ px) fill in broad areas of color quickly, making them ideal for the early stages of a painting. A popular strategy is to start with large shapes to establish the overall composition, then reduce the radius to refine details.

Understanding the Statistics

While the algorithm runs, two counters track its progress. #Selected shows how many shapes have been accepted — each one made the painting more accurate. Attempts shows the total number of shapes tried, including those that were rejected. In the early stages, a high percentage of shapes will be accepted because any addition to a blank canvas helps. As the painting becomes more refined, the acceptance rate drops dramatically — the algorithm must find increasingly precise placements and colors to make further improvements.

The Science Behind the Art

The pixel comparison at the heart of Genetic Painter uses Euclidean color distance — a mathematical measure of how different two colors are. For each pixel in a shape's bounding area, the algorithm calculates the distance between the canvas color and the original image color across all three color channels (red, green, blue). By summing these distances, the algorithm gets a precise "error score" for any region of the canvas.

When a new shape is painted, the algorithm compares the error score of the new state against the previous state. If the total error decreases — meaning the painting is now closer to the original — the shape is accepted. This approach is sometimes called a hill-climbing algorithm because it always moves toward better solutions, never accepting a change that makes the result worse.

Tips for Best Results

• Start with large shapes: Set the max radius to 50–100 px to quickly establish the overall color layout and composition of your image.
• Gradually reduce size: After 5,000–10,000 accepted shapes, lower the max radius to 10–20 px to begin adding fine detail and texture.
• Be patient: Great results often come after 20,000+ accepted generations. The algorithm gets progressively slower at finding improvements, but the refinements it makes become increasingly impressive.
• Try different shapes: The same image can look dramatically different when painted with circles versus triangles or squares. Experiment to find the style you prefer.
• Use high-contrast images: Photos with strong, distinct colors and clear subjects tend to produce the most recognizable results in fewer generations.

The Science Behind Evolutionary Art

Evolutionary art sits at the intersection of computer science, mathematics, and visual arts. The idea of using computational evolution to create images dates back to the 1960s and 1970s, when early computer scientists began experimenting with algorithmic aesthetics.

One of the most famous demonstrations of evolutionary image reconstruction was created by Roger Alsing in 2008, who used a genetic algorithm to approximate the Mona Lisa using only 50 semi-transparent polygons. His experiment showed that surprisingly complex images could emerge from extremely simple building blocks when guided by the principle of natural selection.

Genetic Painter builds on this tradition, allowing anyone to experiment with evolutionary art directly in their browser. By adjusting the shape type, size constraints, and observing the selection process in real time, you gain an intuitive understanding of how evolutionary optimization works — a concept that underpins everything from machine learning to drug discovery to engineering design.

The fitness function — the measure of how "good" a painting is — uses the sum of squared Euclidean distances between pixel colors in RGB space. This is the same metric commonly used in image processing and computer vision for comparing image similarity. Each pixel contributes a distance value based on how far its red, green, and blue components are from the target, and the goal is to minimize this total distance across the entire image.