← back to Apple Loading Barcompare with ground truth →
model output
Claude Sonnet 4.6
Apple Loading Bar
A 0.70T 0.52
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>Apple Boot Screen</title>
7<style>
8 * { margin: 0; padding: 0; box-sizing: border-box; }
9
10 body {
11 background: #0a0a0a;
12 display: flex;
13 flex-direction: column;
14 align-items: center;
15 justify-content: center;
16 height: 100vh;
17 overflow: hidden;
18 }
19
20 .apple-logo {
21 width: 120px;
22 height: 120px;
23 margin-bottom: 120px;
24 }
25
26 .apple-logo svg {
27 width: 100%;
28 height: 100%;
29 fill: white;
30 }
31
32 .progress-container {
33 position: absolute;
34 bottom: 22%;
35 width: 340px;
36 height: 3px;
37 background: #3a3a3a;
38 border-radius: 2px;
39 overflow: hidden;
40 }
41
42 .progress-bar {
43 height: 100%;
44 width: 0%;
45 background: #d0d0d0;
46 border-radius: 2px;
47 animation: progress 8s linear forwards;
48 }
49
50 @keyframes progress {
51 0% { width: 0%; }
52 100% { width: 35%; }
53 }
54</style>
55</head>
56<body>
57
58<div class="apple-logo">
59 <svg viewBox="0 0 814 1000" xmlns="http://www.w3.org/2000/svg">
60 <path d="M788.1 340.9c-5.8 4.5-108.2 62.2-108.2 190.5 0 148.4 130.3 200.9 134.2 202.2-.6 3.2-20.7 71.9-68.7 141.9-42.8 61.6-87.5 123.1-155.5 123.1s-85.5-39.5-164-39.5c-76 0-103.7 40.8-165.9 40.8s-105-57.8-155.5-127.4C46 790.7 0 663 0 541.8c0-207.5 135.4-317.3 269-317.3 70.1 0 128.4 46.4 172.5 46.4 42.8 0 109.6-49 192.5-49 30.9 0 111.2 2.6 168.7 74.4zm-234.5-181.5c31.1-36.9 53.1-88.1 53.1-139.3 0-7.1-.6-14.3-1.9-20.1-50.6 1.9-110.8 33.7-147.1 75.8-28.5 32.4-55.1 83.6-55.1 135.5 0 7.8 1.3 15.6 1.9 18.1 3.2.6 8.4 1.3 13.6 1.3 45.4 0 102.5-30.4 135.5-71.3z"/>
61 </svg>
62</div>
63
64<div class="progress-container">
65 <div class="progress-bar"></div>
66</div>
67
68</body>
69</html>