Design Concept

The typography uses SN Pro for headlines and body text, with SUSE Mono for code, creating a clean, modern, and highly readable experience. All links are underlined in the classic browser blue (#0000EE), maintaining a sense of familiarity and clarity.

Every card image on this site is drawn by code, not by hand. When I add a post, its URL slug becomes the seed of a small random generator, and that generator picks a composition from a fixed vocabulary of shapes. Same seed, same image, every time. The randomness happens once, when the code meets the slug, and then it is frozen forever. I think of these as semi-dynamic: generated, but never changing.

One 1200×1200 canvas serves three crops: the card on the homepage, the banner at the top of the post, and the social share image (which also gets the title overlaid, with the art zoomed, blurred, and tinted so the text stays readable). Each post can be re-rolled through six variants of its seed, and my pick is recorded in the code. A few posts skip the generator and get a hand-designed motif instead, like the video player on my YouTube posts or the branch diagram on the GitHub card. You can browse every variant of every image in the art lab.

The palette is two small, curated pools. Twelve pastels, all bright and pale, are used for backgrounds. Seven bolds, all high-contrast, are used for shapes. Every image gets exactly two of each. The constraint is the point: Josef Albers spent a whole book, Interaction of Color (1963), showing that a color only exists in relation to its neighbors. A burgundy on mint behaves nothing like the same burgundy on butter yellow, so identical rules still produce a different mood for every post.

Limiting the palette also keeps the grid coherent. Ellsworth Kelly worked the same tradeoff from the other side in Spectrum Colors Arranged by Chance (1951): pick the colors first, then let chance place them. His answer, and mine, is that chance inside a chosen palette reads as intention, not noise.

Every background is a two-pastel split: a hard edge or a tight gradient, at one of eight angles. On top of it the generator places two to four shapes from a tiny vocabulary: circle, ring, half-circle, arch, bar, triangle, squiggle. Layouts follow five archetypes (one big shape, a diagonal pair, a rhythmic trio, a 2×2 grid, or a sparse scatter). The vocabulary is deliberately elementary. It is the same starter kit Kandinsky formalized at the Bauhaus in Point and Line to Plane (1926): a few primitive forms, composed with intent, can carry an entire visual language.

The system is an homage to instruction-based art. In 1967 Sol LeWitt wrote that "the idea becomes a machine that makes the art" in Paragraphs on Conceptual Art. His wall drawings are written recipes, and it does not matter who executes them. This site works the same way: the code is the recipe, the slug is the input, and the build pipeline is the draftsman. I made the design decisions when I wrote the rules, not when each image appeared.

Vera Molnár, who was making art with computers before most people had seen one, chased the same balance from the other direction. She built strict algorithmic grids and then disturbed them on purpose, looking for what she called 1% disorder. That is the trick of the whole system. Strict rules underneath, a little seeded chaos on top, so the grid feels composed rather than sterile.