← back to Single Element Spinnercompare with ground truth →
model output
GPT-5.4
Single Element Spinner
A 0.93T 0.32
1<!DOCTYPE html>
2<html lang="en">
3<head>
4<meta charset="UTF-8" />
5<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6<title>Minimal Spinner Replica</title>
7<style>
8 html, body {
9 margin: 0;
10 width: 100%;
11 height: 100%;
12 background: #ffffff;
13 overflow: hidden;
14 }
15
16 .stage {
17 position: relative;
18 width: 100vw;
19 height: 100vh;
20 background: #fff;
21 }
22
23 /* Positioned to match the frames: small spinner near top-left */
24 .spinner {
25 position: absolute;
26 left: 193px;
27 top: 69px;
28 width: 40px;
29 height: 40px;
30 border-radius: 50%;
31 box-sizing: border-box;
32 border: 3px solid #22d3ee;
33 border-top-color: transparent;
34 animation: spin 0.95s linear infinite;
35 }
36
37 @keyframes spin {
38 from { transform: rotate(0deg); }
39 to { transform: rotate(360deg); }
40 }
41</style>
42</head>
43<body>
44 <div class="stage">
45 <div class="spinner"></div>
46 </div>
47</body>
48</html>