← back to Only CSS: Sunset Beachcompare with ground truth →
model output
Qwen3-VL-8B-Instruct
Only CSS: Sunset Beach
A 0.87T 0.26
1<!DOCTYPE html>
2<html lang="en">
3<head>
4 <meta charset="UTF-8">
5 <title>Red Blob Animation</title>
6 <style>
7 body {
8 display: flex;
9 justify-content: center;
10 align-items: center;
11 height: 100vh;
12 background: black;
13 overflow: hidden;
14 }
15 .blob {
16 width: 150px;
17 height: 150px;
18 background: red;
19 border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
20 position: relative;
21 animation: pulse 2s ease-in-out infinite alternate;
22 }
23 .blob::before {
24 content: '';
25 position: absolute;
26 bottom: -20px;
27 left: 50%;
28 transform: translateX(-50%);
29 width: 80px;
30 height: 10px;
31 background: red;
32 border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
33 }
34 @keyframes pulse {
35 0% {
36 transform: scale(1);
37 }
38 50% {
39 transform: scale(1.1);
40 }
41 100% {
42 transform: scale(1);
43 }
44 }
45 </style>
46</head>
47<body>
48 <div class="blob"></div>
49</body>
50</html>