← back to Animated Concepts #3compare with ground truth →
model output
LLaMA 4 Scout
Animated Concepts #3
A 0.69T 0.25
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: #000;
10 margin: 0;
11 display: flex;
12 justify-content: center;
13 align-items: center;
14 height: 100vh;
15 overflow: hidden;
16 }
17 .line {
18 position: absolute;
19 width: 20px;
20 height: 2px;
21 background-color: #ff0000;
22 transform-origin: center;
23 }
24 </style>
25</head>
26<body>
27 <div class="line" id="line"></div>
28 <script>
29 let line = document.getElementById('line');
30 let angle = 0;
31 function animate() {
32 line.style.transform = `translate(0, 0) rotate(${angle}deg)`;
33 angle += 1;
34 if (angle < 360) {
35 requestAnimationFrame(animate);
36 }
37 }
38 animate();
39 </script>
40</body>
41</html>