← back to Sequenced SplitText Animationcompare with ground truth →
model output
LLaMA 4 Scout
Sequenced SplitText Animation
A 0.79T 0.19
1<!DOCTYPE html>
2<html>
3<head>
4 <style>
5 body {
6 font-family: Arial, sans-serif;
7 background-image: linear-gradient(to bottom, #ADD8E6, #FFC5C5);
8 }
9 .text {
10 font-size: 24px;
11 font-weight: bold;
12 text-align: center;
13 margin-top: 20%;
14 }
15 .animate {
16 animation: fadeIn 2s;
17 }
18 @keyframes fadeIn {
19 0% {
20 opacity: 0;
21 }
22 100% {
23 opacity: 1;
24 }
25 }
26 </style>
27</head>
28<body>
29 <div class="text animate">Do you know CSS Animation? It's really awesome!</div>
30 <script>
31 // No JavaScript code needed for this animation
32 </script>
33</body>
34</html>