Every image you see on this blog was generated by code. Not by Midjourney. Not by DALL-E. Not by a designer moving pixels in Photoshop. Each post has a unique image that is born from the content itself, like a visual fingerprint that changes when the content changes and stays identical when the content stays the same.
I built it with PHP and the GD library. No generative art frameworks. No external libraries. Just math, colors, and design decisions translated into code.
Why I built this instead of using AI images
The honest answer is that I wanted something that was truly mine. Midjourney images are impressive but they are generic by nature. Anyone with the same prompt generates something similar. I wanted the visual identity of my blog to be as unique as the content I publish.
I also wanted deterministic consistency. If someone shares my article and another person opens it a month later, the image has to be exactly the same. With generative AI that is not possible. With a deterministic algorithm it is.
And there was a practical reason. Code-generated images weigh less than photos, scale without pixelation, and have no copyright issues because they literally do not represent anything that exists in the real world.
The algorithm: from content hash to unique image
The system works like this. It takes the post title and generates an MD5 hash. That hash is a string of 32 hexadecimal characters that is unique to each title. Then it maps groups of those characters to colors, builds a grid of colored cells, expands it symmetrically to create a balanced pattern, and renders it as a PNG.
The same title always produces the same hash. The same hash always produces the same colors. The same colors always produce the same image. Pure determinism.
Color mapping: turning hex characters into a cohesive palette
This was the hardest part from a design perspective. The first attempts produced palettes that looked like visual noise. Random colors with no relationship to each other, brutal contrasts that hurt to look at.
The solution was to constrain the color space. Instead of mapping each character to any possible color, I defined hue ranges that stayed within harmonic families. One character determines the base hue, another adjusts saturation, another luminosity. The result is palettes that feel intentional because they are mathematically constrained to combinations that work.
I gave Claude feedback from my design perspective. The contrast is too low between adjacent cells. The center needs more visual weight. The palette needs to feel cohesive not like random noise. Claude adjusted the algorithm based on my visual feedback and after several iterations the results started feeling like design and not like accident.
Grid generation and symmetry
The grid starts small. A 5x5 cell grid where each cell takes its color from the hash. But a 5x5 grid looks too simple so the system expands it. It takes the left half and mirrors it to the right creating horizontal symmetry. That immediately transforms something random into something that looks designed.
Symmetry is the trick that makes everything work. The human brain seeks patterns and symmetry is the most basic pattern we recognize. Without it the images looked like rendering errors. With it they look like abstract icons.
Then the system clears the center of the image leaving a space that gives the pattern room to breathe. Without that space everything felt cramped and aggressive.
Rendering with PHP GD
PHP GD is not a sophisticated tool for generative art. It is basic. You create an image, paint rectangles, save as PNG. But that simplicity was an advantage. I did not have to learn a complex library. I just had to think about pixels, colors, and coordinates.
The final render takes the expanded grid and paints each cell as a rectangle with its assigned color. It adds anti-aliasing at the edges to smooth the image and saves it as a PNG in a server folder. The entire process takes milliseconds.
Every time a post is created or its title is updated the system regenerates the image automatically. The admin panel does not have a button for this. It just happens.
How to adapt this system for your own projects
The concept is simpler than it seems. You need three things: a deterministic input like a title or an ID, a hash function that converts that input into numbers, and a renderer that converts those numbers into something visual.
You do not have to use PHP. You can do the same thing with JavaScript in the browser using Canvas, with Python using Pillow, or even generate SVGs directly which would be lighter and more scalable.
What matters is not the technology. It is the idea that content defines its own visual identity. That you do not need a designer for every image or an AI that invents something generic. You can build a system that makes each piece of content represent itself.
That is generative design with code. And anyone who knows how to think in systems can build it.