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

model output

LLaMA 4 Scout

SVG Loading icons

A 0.61T 0.24
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>Loading Animation</title>
7    <style>
8        body {
9            background-color: #333;
10            display: flex;
11            justify-content: center;
12            align-items: center;
13            height: 100vh;
14            margin: 0;
15        }
16        .dot {
17            width: 8px;
18            height: 8px;
19            background-color: #FFC107;
20            border-radius: 50%;
21            animation: pulse 1.5s infinite;
22        }
23        .dot:nth-child(1) {
24            animation-delay: 0s;
25        }
26        .dot:nth-child(2) {
27            animation-delay: 0.5s;
28        }
29        .dot:nth-child(3) {
30            animation-delay: 1s;
31        }
32        @keyframes pulse {
33            0% {
34                transform: scale(1);
35            }
36            50% {
37                transform: scale(1.5);
38            }
39            100% {
40                transform: scale(1);
41            }
42        }
43    </style>
44</head>
45<body>
46    <div class="dot"></div>
47    <div class="dot"></div>
48    <div class="dot"></div>
49</body>
50</html>