Gallery, prompt v1

A spoon stirring in a cup, in HTML and CSS

One frozen prompt and every model that has run it, newest first.

The prompt, v1, frozen

Using only HTML and CSS, with no JavaScript, SVG or images, make a cup of coffee with a spoon stirring round and round inside it.

Every model, its first three runs.

One square a check, in this order:

  1. HTML and CSS only
  2. A CSS loop that moves something
  3. Reads as a cup seen into
  4. The spoon does the stirring
  5. Reads as inside the cup
  6. Handle stays on the bowl

passed, failed, undecided. A round mark is a check I judged by eye, and a diamond one a check a model judged.

Claude Sonnet 5.5
DeepSeek 4.1 Flash
GLM 5.3 FlashX

What a run cost, against checks passed.

One dot a model, over its three runs above. Further right costs more. The gap from $0.01 to $0.1 is as wide as the gap from $0.1 to $1, so the cheap models are not squeezed into a corner.

0%25%50%75%100%$0.01$0.03$0.1$0.3cost per runClaude Sonnet 5.5: $0.0093 a run, 18 of 18 checks passedClaude Sonnet 5.5GLM 5.3 FlashX: $0.059 a run, 15 of 18 checks passedGLM 5.3 FlashXDeepSeek 4.1 Flash: $0.25 a run, 12 of 17 checks passedDeepSeek 4.1 Flash
Every dot answered this prompt with these checks, so they compare. A run that produced nothing still cost what it cost, and passed none of the checks.

How it is checked

HTML and CSS alone, a continuous loop, and a cup seen from slightly above. The file is read for the brief and for the loop: an @keyframes rule that changes a position or a transform, named by an element, with the iteration count set to infinite. The picture is four moments of the animation, left to right, taken at 0.4 s, 1.2 s, 2.0 s and 2.8 s. Whether the rim reads as an ellipse seen from above, whether the spoon passes behind the far rim on the back half of its circuit, and whether the handle stays on the bowl are judged by eye from the page the run rendered, with the four frames as a first look.

HTML and CSS onlymeasuredNo <script>, <svg>, <img>, <canvas>, <iframe>, external url(...) or javascript: URL in the file.
A CSS loop that moves somethingmeasuredAn @keyframes rule that changes a transform, a translation, a rotation or an offset between stops, named in an animation on an element, with the iteration count infinite. It does not know which element moves: on 2026-10-19 a GLM run passed it by turning the coffee surface while the spoon stood still, and the eye checks are what caught that.
Reads as a cup seen intoby eyeThe coffee surface is visible inside a rim that has some thickness, whether that is an ellipse seen from slightly above or a ring seen from straight down. A flat disc with no rim, or a cup whose inside cannot be seen, fails it.
The spoon does the stirringby eyeThe spoon itself, bowl and handle together, travels round inside the opening, so its place changes across the loop. Judge it from the live page or the video, since the four still moments can show almost the same instant. A file whose only motion is in the coffee surface, with the spoon stood still at the rim, fails it.
Reads as inside the cupby eyeThe bowl stays within the rim of the opening and the handle leaves over the near edge, so the spoon reads as in the drink rather than laid on top of the picture. A spoon drawn across the cup mouth in front of the rim for the whole turn fails it, which is the trap.
Handle stays on the bowlby eyeThe handle meets the bowl of the spoon in every frame. A handle that separates, points the wrong way or is missing fails it.

When this saturates: Ask for the spoon to stir along the side of the cup, so the bowl has to stay inside the rim at every angle of the loop while the four sampled moments show only four of them.

Failures seen here: broken (fails when the model's file runs, but doesn't do what it should); false (fails when the model gets a fact wrong, such as a part in the wrong place or at the wrong size). The same kinds across every task.

The rules behind all of thisThis task's prompt, checks and any checker, on GitHub