animation2code benchmark
For best compatibility, please view this dashboard in a Chrome browser.
← back to flat loading animate

model output

Qwen3-VL-8B-Instruct

flat loading animate

A 0.66T 0.32
compare with ground truth →
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    display: flex;
10    justify-content: center;
11    align-items: center;
12    height: 100vh;
13    margin: 0;
14    background: white;
15  }
16  .dot {
17    width: 20px;
18    height: 20px;
19    background: radial-gradient(circle, #ff6b6b, #ff9a9e);
20    border-radius: 50%;
21    position: relative;
22    animation: pulse 1.5s ease-in-out infinite alternate;
23  }
24  .dot:nth-child(2) {
25    animation-delay: 0.3s;
26  }
27  @keyframes pulse {
28    0% {
29      transform: scale(1) translateY(0);
30      opacity: 1;
31    }
32    100% {
33      transform: scale(1.2) translateY(-10px);
34      opacity: 0.7;
35    }
36  }
37</style>
38</head>
39<body>
40  <div class="dot"></div>
41  <div class="dot"></div>
42</body>
43</html>