← back to Tiny Single Element Loading Animationscompare with ground truth →
model output
Qwen3-VL-8B-Instruct
Tiny Single Element Loading Animations
A 0.78T 0.29
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>Animation</title>
7 <style>
8 body {
9 margin: 0;
10 padding: 0;
11 background-color: white;
12 overflow: hidden;
13 }
14 .dot {
15 position: absolute;
16 width: 5px;
17 height: 5px;
18 background-color: black;
19 border-radius: 50%;
20 animation: pulse 1.5s infinite;
21 }
22 .dot:nth-child(1) {
23 left: 10px;
24 top: 10px;
25 animation-delay: 0s;
26 }
27 .dot:nth-child(2) {
28 left: 30px;
29 top: 10px;
30 animation-delay: 0.2s;
31 }
32 .dot:nth-child(3) {
33 left: 50px;
34 top: 10px;
35 animation-delay: 0.4s;
36 }
37 @keyframes pulse {
38 0%, 100% {
39 transform: scale(1);
40 opacity: 1;
41 }
42 50% {
43 transform: scale(1.2);
44 opacity: 0.5;
45 }
46 }
47 </style>
48</head>
49<body>
50 <div class="dot"></div>
51 <div class="dot"></div>
52 <div class="dot"></div>
53</body>
54</html>