ground truth

Thinking about SVG-preloaders

csssource ↗

model outputs

Gemini 3 Flash Preview →

A 0.66T 0.28

Qwen3-VL-8B-Instruct →

A 0.48T 0.33

GPT-5.4 →

A 0.91T 0.25

Claude Sonnet 4.6 →

A 0.78T 0.11

LLaMA 4 Scout →

A 0.70T 0.13

1<div class="l-wrapper">
2<svg viewBox="0 0 120 120" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
3  <symbol id="s--circle">
4        <circle r="10" cx="20" cy="20"></circle>
5      </symbol>
6
7      <g class="g-circles g-circles--v3">
8        <g class="g--circle">
9          <use xlink:href="#s--circle" class="u--circle"/>
10        </g>  
11        <g class="g--circle">
12          <use xlink:href="#s--circle" class="u--circle"/>
13        </g>
14        <g class="g--circle">
15          <use xlink:href="#s--circle" class="u--circle"/>
16        </g>
17        <g class="g--circle">
18          <use xlink:href="#s--circle" class="u--circle"/>
19        </g>
20        <g class="g--circle">
21          <use xlink:href="#s--circle" class="u--circle"/>
22        </g>
23        <g class="g--circle">
24          <use xlink:href="#s--circle" class="u--circle"/>
25        </g>
26        <g class="g--circle">
27          <use xlink:href="#s--circle" class="u--circle"/>
28        </g>
29        <g class="g--circle">
30          <use xlink:href="#s--circle" class="u--circle"/>
31        </g>
32        <g class="g--circle">
33          <use xlink:href="#s--circle" class="u--circle"/>
34        </g>
35        <g class="g--circle">
36          <use xlink:href="#s--circle" class="u--circle"/>
37        </g>
38        <g class="g--circle">
39          <use xlink:href="#s--circle" class="u--circle"/>
40        </g>
41        <g class="g--circle">
42          <use xlink:href="#s--circle" class="u--circle"/>
43        </g>
44  </svg>
45</div>
46