animation2code benchmark
For best compatibility, please view this dashboard in a Chrome browser.
← back to Wavy Loading Animations

model output

Qwen3-VL-8B-Instruct

Wavy Loading Animations

A 0.57T 0.11
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            background-color: #f0f0f0;
10            display: flex;
11            justify-content: center;
12            align-items: center;
13            height: 100vh;
14            margin: 0;
15            font-family: Arial, sans-serif;
16        }
17        .text {
18            font-size: 16px;
19            color: #333;
20            text-align: center;
21            animation: fadeIn 1s ease-in-out;
22        }
23        @keyframes fadeIn {
24            0% { opacity: 0; }
25            100% { opacity: 1; }
26        }
27    </style>
28</head>
29<body>
30    <div class="text">Hello World</div>
31
32    <script>
33        // No JavaScript needed for this simple animation
34    </script>
35</body>
36</html>