SingleDiv Art began as a challenge: how much could be expressed with almost nothing? Inspired by Lynn Fisher’s A Single Div, I set out to see what was possible when the only building block was a single HTML element and the entire creative space came from CSS. What emerged was less about illustration and more about learning to see constraints as opportunities. Could a box-shadow become a brick wall? Could gradients bend into the illusion of depth? Could pseudo-elements conjure shapes that never should have fit inside one container? These became the kinds of questions that guided the project.
Bending CSS to Its Limits
- One
divforms the entire canvas. ::beforeand::afterare stretched, rotated, and layered until they stop resembling pseudo-elements and start resembling art.- Box-shadows aren’t shadows anymore—they’re building blocks. Border-radius curves turn into arcs, circles, and abstract shapes.
- With careful layering, entire illustrations emerge: recognizable, complex, and impossible at first glance.
What I Learned
SingleDiv Art taught me the quirks of browsers in a way no documentation could. Chrome, Firefox, and Safari each had their own way of interpreting stacked shadows and overlapping transforms. Rendering differences became part of the creative process, sometimes frustrating, often inspiring. The constraint of one div also changed how I think as an engineer: instead of reaching for more elements or libraries, I asked what I could do with what was already there.
Why It Matters
At first it was an exercise in imitation—recreating the aesthetic I admired from Lynn Fisher’s work. But soon it became something else: a playground where minimalism drove invention. It showed me that simplicity can be provocative. It reminded me that sometimes the most elegant solution isn’t the one with the most parts, but the one that forces you to twist the rules just enough to make something unexpected happen.
