https://evanliomain.github.io/css-battle-blog/ 2026-11-04T11:28:28+00:00 Evan Liomain https://evanliomain.github.io/css-battle-blog/2026/11/03/one-shadow-list-two-jobs/ 2026-11-03T00:00:00+00:00

The November 3 target is a grey-green column standing on a wider base, with three triangular notches: two on the right, one on the left. Vegy’s solution has no gradient and no clipping. It writes one list of four shadows, and both html and body use it: on html they draw the column, on a 3D-rotated body they carve the notches.

https://evanliomain.github.io/css-battle-blog/2026/10/08/one-tile-slid-halfway/ 2026-10-08T00:00:00+00:00

The October 8 target looks like a lollipop, or a little tree: a blue half-disc standing on its flat side, an orange disc in front of it, and a grey stick underneath. Vegy draws it with two gradients on html and the body as the stick. The clever part is how the half-disc gets its flat side: nothing cuts it, the background tile does.

https://evanliomain.github.io/css-battle-blog/2026/10/07/one-gradient-two-zooms/ 2026-10-07T00:00:00+00:00

The October 7 target looks like a Greek theta on a lime card: a ring that sticks out above and below a rectangle, cut in half by a bar. The winning solution draws it with no extra element and no border at all. It is one rule, matched by html and body, and it reuses one gradient twice, at two sizes.