Hugging Face's logo

Spaces:
GuminiResearch
/
Gumini_sLLM_Report
Running

App Files Community
GuminiResearch commited on
Commit
fb11120
·
verified ·
1 Parent(s): ffcdc43

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +2021 -18
index.html CHANGED
@@ -1,19 +1,2022 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19
  </html>
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <title>Gumini (구미니) - Data-Efficient Korean-English Pretraining LLM</title>
8
+
9
+ <meta name="title" content="Gumini 1B - 1.5B | Open Source Release">
10
+ <meta name="description" content="Gumini outperforms Qwen-2.5-1.5B with 5,732× less data. The new standard for data-efficient Korean LLMs. #3 Overall Rank with only 3.14B training tokens.">
11
+ <meta property="og:type" content="website">
12
+ <meta property="og:url" content="https://gumini-research.github.io/Gumini_sLLM_Report/">
13
+ <meta property="og:title" content="Gumini 1B - 1.5B | Open Source Release">
14
+ <meta property="og:description" content="Gumini outperforms Qwen-2.5-1.5B with 5,732× less data and surpasses Llama-3.2-3B with 2,866× less data. The new standard for data-efficient Korean LLMs.">
15
+ <meta property="og:image" content="https://gumini-research.github.io/Gumini_sLLM_Report/assets/og-image.png">
16
+ <meta property="og:image:width" content="1200">
17
+ <meta property="og:image:height" content="630">
18
+ <meta property="og:locale" content="ko_KR">
19
+ <meta property="og:locale:alternate" content="en_US">
20
+ <meta property="og:site_name" content="Gumini Research">
21
+ <meta name="twitter:card" content="summary_large_image">
22
+ <meta name="twitter:url" content="https://gumini-research.github.io/Gumini_sLLM_Report/">
23
+ <meta name="twitter:title" content="Gumini 1B - 1.5B | Open Source Release">
24
+ <meta name="twitter:description" content="Gumini outperforms Qwen-2.5-1.5B with 5,732× less data. #3 Overall Rank with only 3.14B training tokens.">
25
+ <meta name="twitter:image" content="https://gumini-research.github.io/Gumini_sLLM_Report/assets/og-image.png">
26
+ <meta name="twitter:site" content="@Gumini_Research">
27
+ <meta name="twitter:creator" content="@Gumini_Research">
28
+ <link rel="icon" type="image/svg+xml" href="assets/favicon.svg">
29
+ <link rel="icon" type="image/png" sizes="192x192" href="assets/favicon.png">
30
+ <link rel="apple-touch-icon" href="assets/favicon.png">
31
+ <link
32
+ href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap"
33
+ rel="stylesheet">
34
+ <link rel="stylesheet" as="style" crossorigin
35
+ href="https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard.min.css" />
36
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.1/css/all.min.css">
37
+ <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
38
+ <style>
39
+ :root {
40
+ --primary: #F72585;
41
+ --primary-glow: rgba(247, 37, 133, 0.4);
42
+ --secondary: #161b22;
43
+ --accent: #FF8E53;
44
+ --accent-glow: rgba(255, 142, 83, 0.4);
45
+ --bg: #0D1117;
46
+ --bg-card: rgba(22, 27, 34, 0.8);
47
+ --bg-card-hover: rgba(48, 54, 61, 0.8);
48
+ --text: #c9d1d9;
49
+ --text-secondary: #8b949e;
50
+ --border: rgba(48, 54, 61, 0.6);
51
+ --gradient-1: linear-gradient(135deg, #F72585 0%, #FF8E53 100%);
52
+ --gradient-2: linear-gradient(135deg, #FF8E53 0%, #FFD700 100%);
53
+ --gradient-text: linear-gradient(90deg, #F72585, #FF8E53, #FFD700);
54
+ --glass: blur(12px);
55
+ }
56
+
57
+ * {
58
+ margin: 0;
59
+ padding: 0;
60
+ box-sizing: border-box;
61
+ }
62
+
63
+ body {
64
+ font-family: 'Pretendard', 'Outfit', sans-serif;
65
+ background: var(--bg);
66
+ color: var(--text);
67
+ line-height: 1.6;
68
+ overflow-x: hidden;
69
+ selection-background-color: var(--primary);
70
+ selection-color: white;
71
+ }
72
+
73
+ .scroll-progress {
74
+ position: fixed;
75
+ top: 0;
76
+ left: 0;
77
+ width: 0%;
78
+ height: 3px;
79
+ background: var(--gradient-1);
80
+ z-index: 1001;
81
+ transition: width 0.1s;
82
+ box-shadow: 0 0 10px #F72585;
83
+ }
84
+
85
+ .bg-orb {
86
+ position: fixed;
87
+ border-radius: 50%;
88
+ filter: blur(120px);
89
+ z-index: -1;
90
+ opacity: 0.3;
91
+ animation: float 25s infinite alternate cubic-bezier(0.4, 0, 0.2, 1);
92
+ }
93
+
94
+ .orb-1 {
95
+ width: 900px;
96
+ height: 900px;
97
+ background: radial-gradient(circle, rgba(247, 37, 133, 0.25) 0%, transparent 70%);
98
+ top: -30%;
99
+ left: 50%;
100
+ transform: translateX(-50%);
101
+ animation-delay: 0s;
102
+ opacity: 1;
103
+ filter: blur(80px);
104
+ }
105
+
106
+ .orb-2 {
107
+ width: 600px;
108
+ height: 600px;
109
+ background: linear-gradient(180deg, #FF8E53 0%, transparent 100%);
110
+ bottom: -10%;
111
+ right: -5%;
112
+ animation-delay: -5s;
113
+ opacity: 0.4;
114
+ }
115
+
116
+ .orb-3 {
117
+ width: 500px;
118
+ height: 500px;
119
+ background: #FFD700;
120
+ top: 30%;
121
+ left: -10%;
122
+ animation-delay: -10s;
123
+ opacity: 0.15;
124
+ filter: blur(150px);
125
+ }
126
+
127
+ @keyframes float {
128
+ 0% {
129
+ transform: translate(0, 0) scale(1);
130
+ }
131
+
132
+ 100% {
133
+ transform: translate(50px, 80px) scale(1.1);
134
+ }
135
+ }
136
+
137
+ .container {
138
+ max-width: 1200px;
139
+ margin: 0 auto;
140
+ padding: 0 24px;
141
+ }
142
+
143
+ nav {
144
+ position: fixed;
145
+ top: 0;
146
+ left: 0;
147
+ right: 0;
148
+ z-index: 1000;
149
+ padding: 24px 0;
150
+ transition: all 0.4s ease;
151
+ }
152
+
153
+ nav.scrolled {
154
+ background: rgba(3, 3, 5, 0.85);
155
+ backdrop-filter: var(--glass);
156
+ border-bottom: 1px solid var(--border);
157
+ padding: 16px 0;
158
+ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
159
+ }
160
+
161
+ nav .container {
162
+ display: flex;
163
+ justify-content: space-between;
164
+ align-items: center;
165
+ position: relative;
166
+ }
167
+
168
+ nav::after {
169
+ content: '';
170
+ position: absolute;
171
+ bottom: 0;
172
+ left: 0;
173
+ right: 0;
174
+ height: 1px;
175
+ background: var(--gradient-text);
176
+ opacity: 0;
177
+ transition: opacity 0.3s;
178
+ }
179
+
180
+ nav.scrolled::after {
181
+ opacity: 1;
182
+ }
183
+
184
+ .logo {
185
+ font-size: 1.8rem;
186
+ font-weight: 700;
187
+ color: white;
188
+ letter-spacing: -0.5px;
189
+ display: flex;
190
+ align-items: center;
191
+ gap: 8px;
192
+ }
193
+
194
+ .nav-links {
195
+ display: flex;
196
+ gap: 40px;
197
+ list-style: none;
198
+ align-items: center;
199
+ }
200
+
201
+ .nav-links a {
202
+ color: var(--text-secondary);
203
+ text-decoration: none;
204
+ font-weight: 500;
205
+ font-size: 0.95rem;
206
+ transition: all 0.3s;
207
+ position: relative;
208
+ padding: 4px 0;
209
+ }
210
+
211
+ .nav-links a::after {
212
+ content: '';
213
+ position: absolute;
214
+ bottom: 0;
215
+ left: 0;
216
+ width: 0;
217
+ height: 2px;
218
+ background: white;
219
+ transition: width 0.3s ease;
220
+ }
221
+
222
+ .nav-links a:hover {
223
+ color: white;
224
+ text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
225
+ }
226
+
227
+ .nav-links a:hover::after {
228
+ width: 100%;
229
+ }
230
+
231
+ .lang-toggle {
232
+ display: flex;
233
+ background: rgba(255, 255, 255, 0.05);
234
+ border-radius: 30px;
235
+ padding: 4px;
236
+ border: 1px solid var(--border);
237
+ }
238
+
239
+ .lang-btn {
240
+ padding: 6px 18px;
241
+ border: none;
242
+ background: transparent;
243
+ color: var(--text-secondary);
244
+ font-size: 0.85rem;
245
+ font-weight: 600;
246
+ cursor: pointer;
247
+ border-radius: 24px;
248
+ transition: all 0.3s;
249
+ }
250
+
251
+ .lang-btn.active {
252
+ background: var(--gradient-1);
253
+ color: white;
254
+ box-shadow: 0 4px 15px var(--primary-glow);
255
+ }
256
+
257
+ .hero {
258
+ min-height: 100vh;
259
+ display: flex;
260
+ align-items: center;
261
+ justify-content: center;
262
+ text-align: center;
263
+ padding: 160px 0 100px;
264
+ position: relative;
265
+ }
266
+
267
+ .hero-content {
268
+ max-width: 1000px;
269
+ z-index: 1;
270
+ }
271
+
272
+ .hero-badge {
273
+ display: inline-flex;
274
+ align-items: center;
275
+ gap: 10px;
276
+ background: rgba(255, 142, 83, 0.1);
277
+ border: 1px solid rgba(255, 142, 83, 0.4);
278
+ padding: 8px 20px;
279
+ border-radius: 100px;
280
+ font-size: 0.9rem;
281
+ color: #FF8E53;
282
+ margin-bottom: 40px;
283
+ backdrop-filter: blur(10px);
284
+ box-shadow: 0 0 20px rgba(255, 142, 83, 0.2);
285
+ transition: transform 0.3s;
286
+ }
287
+
288
+ .hero-badge:hover {
289
+ transform: scale(1.05);
290
+ box-shadow: 0 0 30px rgba(255, 142, 83, 0.4);
291
+ }
292
+
293
+ .hero h1 {
294
+ font-size: 6rem;
295
+ font-weight: 800;
296
+ line-height: 1.05;
297
+ margin-bottom: 32px;
298
+ letter-spacing: -1.5px;
299
+ color: white;
300
+ }
301
+
302
+ .hero h1 span {
303
+ background: var(--gradient-text);
304
+ -webkit-background-clip: text;
305
+ -webkit-text-fill-color: transparent;
306
+ background-size: 200% auto;
307
+ animation: gradientMove 5s linear infinite;
308
+ }
309
+
310
+ @keyframes gradientMove {
311
+ 0% {
312
+ background-position: 0% 50%;
313
+ }
314
+
315
+ 50% {
316
+ background-position: 100% 50%;
317
+ }
318
+
319
+ 100% {
320
+ background-position: 0% 50%;
321
+ }
322
+ }
323
+
324
+ .hero h1 .sub-name {
325
+ display: none;
326
+ -webkit-text-fill-color: var(--text-secondary);
327
+ font-weight: 500;
328
+ vertical-align: middle;
329
+ margin-left: 16px;
330
+ letter-spacing: 0;
331
+ opacity: 0.8;
332
+ }
333
+
334
+ .hero-subtitle {
335
+ font-size: 1.6rem;
336
+ color: var(--text-secondary);
337
+ margin-bottom: 56px;
338
+ max-width: 850px;
339
+ margin-left: auto;
340
+ margin-right: auto;
341
+ font-weight: 300;
342
+ line-height: 1.5;
343
+ }
344
+
345
+ .hero-stats {
346
+ display: flex;
347
+ justify-content: center;
348
+ gap: 80px;
349
+ margin-bottom: 70px;
350
+ flex-wrap: wrap;
351
+ }
352
+
353
+ .hero-stat {
354
+ text-align: center;
355
+ position: relative;
356
+ }
357
+
358
+ .hero-stat::after {
359
+ content: '';
360
+ position: absolute;
361
+ right: -40px;
362
+ top: 50%;
363
+ transform: translateY(-50%);
364
+ width: 1px;
365
+ height: 50px;
366
+ background: linear-gradient(to bottom, transparent, var(--border), transparent);
367
+ }
368
+
369
+ .hero-stat:last-child::after {
370
+ display: none;
371
+ }
372
+
373
+ .hero-stat-value {
374
+ font-size: 4rem;
375
+ font-weight: 800;
376
+ background: linear-gradient(to bottom, #fff, #a0a0b0);
377
+ -webkit-background-clip: text;
378
+ -webkit-text-fill-color: transparent;
379
+ line-height: 1;
380
+ margin-bottom: 8px;
381
+ }
382
+
383
+ .hero-stat-label {
384
+ font-size: 1rem;
385
+ color: var(--accent);
386
+ font-weight: 600;
387
+ text-transform: uppercase;
388
+ letter-spacing: 1.5px;
389
+ }
390
+
391
+ .hero-buttons {
392
+ display: flex;
393
+ gap: 24px;
394
+ justify-content: center;
395
+ flex-wrap: wrap;
396
+ }
397
+
398
+ .btn {
399
+ display: inline-flex;
400
+ align-items: center;
401
+ gap: 12px;
402
+ padding: 18px 40px;
403
+ border-radius: 20px;
404
+ font-weight: 600;
405
+ font-size: 1.1rem;
406
+ text-decoration: none;
407
+ transition: all 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
408
+ cursor: pointer;
409
+ border: none;
410
+ position: relative;
411
+ overflow: hidden;
412
+ border: 1px solid rgba(255, 255, 255, 0.1);
413
+ }
414
+
415
+ .btn-primary {
416
+ background: var(--gradient-1);
417
+ color: white;
418
+ box-shadow: 0 10px 40px rgba(247, 37, 133, 0.3);
419
+ border: 1px solid rgba(255, 255, 255, 0.1);
420
+ }
421
+
422
+ .btn-primary:hover {
423
+ transform: translateY(-2px);
424
+ box-shadow: 0 20px 50px rgba(247, 37, 133, 0.5);
425
+ }
426
+
427
+ .btn-secondary {
428
+ background: rgba(255, 255, 255, 0.05);
429
+ color: white;
430
+ border: 1px solid var(--border);
431
+ backdrop-filter: blur(10px);
432
+ }
433
+
434
+ .btn-secondary:hover {
435
+ background: rgba(255, 255, 255, 0.1);
436
+ border-color: white;
437
+ transform: translateY(-4px);
438
+ box-shadow: 0 10px 30px rgba(255, 255, 255, 0.1);
439
+ }
440
+
441
+ .highlight-box {
442
+ background: rgba(20, 20, 35, 0.6);
443
+ border: 1px solid var(--border);
444
+ border-radius: 40px;
445
+ padding: 80px;
446
+ margin: 100px 0;
447
+ text-align: center;
448
+ position: relative;
449
+ overflow: hidden;
450
+ backdrop-filter: blur(20px);
451
+ box-shadow: 0 40px 100px rgba(0, 0, 0, 0.5);
452
+ }
453
+
454
+ .highlight-box::before {
455
+ content: '';
456
+ position: absolute;
457
+ top: 0;
458
+ left: 0;
459
+ right: 0;
460
+ height: 1px;
461
+ background: linear-gradient(90deg, transparent, var(--primary), transparent);
462
+ }
463
+
464
+ .shimmer {
465
+ background: linear-gradient(to right, #F72585 0%, #fff 50%, #FF8E53 100%);
466
+ background-size: 200% auto;
467
+ -webkit-background-clip: text;
468
+ -webkit-text-fill-color: transparent;
469
+ animation: shimmer 5s linear infinite;
470
+ }
471
+
472
+ @keyframes shimmer {
473
+ 0% {
474
+ background-position: 0% 50%;
475
+ }
476
+
477
+ 100% {
478
+ background-position: 200% 50%;
479
+ }
480
+ }
481
+
482
+ .highlight-number {
483
+ font-size: 7rem;
484
+ font-weight: 800;
485
+ line-height: 1;
486
+ margin: 24px 0;
487
+ text-shadow: 0 0 40px rgba(247, 37, 133, 0.4);
488
+ }
489
+
490
+ section {
491
+ padding: 140px 0;
492
+ }
493
+
494
+ @media (max-width: 768px) {
495
+ .comparison-table {
496
+ font-size: 0.85rem;
497
+ }
498
+
499
+ .comparison-table th,
500
+ .comparison-table td {
501
+ padding: 12px 10px;
502
+ }
503
+
504
+ .table-container {
505
+ overflow-x: auto;
506
+ -webkit-overflow-scrolling: touch;
507
+ }
508
+ }
509
+
510
+ .modal {
511
+ display: none;
512
+ position: fixed;
513
+ z-index: 10000;
514
+ left: 0;
515
+ top: 0;
516
+ width: 100%;
517
+ height: 100%;
518
+ background-color: rgba(0, 0, 0, 0.9);
519
+ align-items: center;
520
+ justify-content: center;
521
+ cursor: zoom-out;
522
+ }
523
+
524
+ .modal.active {
525
+ display: flex;
526
+ }
527
+
528
+ .modal img {
529
+ max-width: 90%;
530
+ max-height: 90%;
531
+ border-radius: 16px;
532
+ box-shadow: 0 0 60px rgba(247, 37, 133, 0.3);
533
+ }
534
+
535
+ .modal-close {
536
+ position: absolute;
537
+ top: 30px;
538
+ right: 40px;
539
+ color: white;
540
+ font-size: 2rem;
541
+ cursor: pointer;
542
+ opacity: 0.7;
543
+ transition: opacity 0.3s;
544
+ }
545
+
546
+ .modal-close:hover {
547
+ opacity: 1;
548
+ }
549
+
550
+ .figure-img {
551
+ cursor: zoom-in;
552
+ transition: transform 0.3s;
553
+ }
554
+
555
+ .figure-img:hover {
556
+ transform: scale(1.02);
557
+ }
558
+
559
+ .section-header {
560
+ text-align: center;
561
+ margin-bottom: 100px;
562
+ }
563
+
564
+ .section-tag {
565
+ display: inline-block;
566
+ color: var(--accent);
567
+ font-size: 0.95rem;
568
+ font-weight: 700;
569
+ letter-spacing: 3px;
570
+ text-transform: uppercase;
571
+ margin-bottom: 20px;
572
+ position: relative;
573
+ padding-left: 24px;
574
+ }
575
+
576
+ .section-tag::before {
577
+ content: '';
578
+ position: absolute;
579
+ left: 0;
580
+ top: 50%;
581
+ width: 16px;
582
+ height: 2px;
583
+ background: var(--accent);
584
+ box-shadow: 0 0 10px var(--accent);
585
+ }
586
+
587
+ .section-title {
588
+ font-size: 3.5rem;
589
+ font-weight: 700;
590
+ margin-bottom: 24px;
591
+ background: linear-gradient(to bottom, #fff, #a0a0b0);
592
+ -webkit-background-clip: text;
593
+ -webkit-text-fill-color: transparent;
594
+ }
595
+
596
+ .section-desc {
597
+ color: var(--text-secondary);
598
+ max-width: 750px;
599
+ margin: 0 auto;
600
+ font-size: 1.25rem;
601
+ line-height: 1.7;
602
+ }
603
+
604
+ .comparison-grid {
605
+ display: grid;
606
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
607
+ gap: 32px;
608
+ margin: 80px 0;
609
+ }
610
+
611
+ .comparison-card {
612
+ background: var(--bg-card);
613
+ border: 1px solid var(--border);
614
+ border-radius: 30px;
615
+ padding: 40px 32px;
616
+ transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
617
+ position: relative;
618
+ overflow: hidden;
619
+ backdrop-filter: blur(10px);
620
+ }
621
+
622
+ .comparison-card:hover {
623
+ transform: translateY(-12px) scale(1.02);
624
+ background: var(--bg-card-hover);
625
+ border-color: rgba(255, 255, 255, 0.2);
626
+ box-shadow: 0 30px 60px rgba(0, 0, 0, 0.4);
627
+ }
628
+
629
+ .comparison-card.ours {
630
+ background: linear-gradient(145deg, rgba(247, 37, 133, 0.1), rgba(22, 27, 34, 0.9));
631
+ border: 1px solid rgba(247, 37, 133, 0.4);
632
+ box-shadow: 0 0 30px rgba(247, 37, 133, 0.1);
633
+ }
634
+
635
+ .comparison-card.ours:hover {
636
+ box-shadow: 0 0 50px rgba(247, 37, 133, 0.2);
637
+ border-color: #F72585;
638
+ }
639
+
640
+ .comparison-card h4 {
641
+ font-size: 1.5rem;
642
+ margin-bottom: 16px;
643
+ display: flex;
644
+ align-items: center;
645
+ justify-content: space-between;
646
+ }
647
+
648
+ .badge-ours {
649
+ background: var(--gradient-1);
650
+ color: white;
651
+ padding: 6px 14px;
652
+ border-radius: 14px;
653
+ font-size: 0.75rem;
654
+ font-weight: 700;
655
+ text-transform: uppercase;
656
+ box-shadow: 0 4px 15px var(--primary-glow);
657
+ }
658
+
659
+ .comparison-tokens {
660
+ font-size: 2.5rem;
661
+ font-weight: 700;
662
+ margin: 24px 0;
663
+ color: white;
664
+ }
665
+
666
+ .comparison-bar {
667
+ height: 8px;
668
+ background: rgba(255, 255, 255, 0.08);
669
+ border-radius: 4px;
670
+ margin: 24px 0;
671
+ overflow: hidden;
672
+ }
673
+
674
+ .comparison-fill {
675
+ height: 100%;
676
+ background: var(--gradient-2);
677
+ border-radius: 4px;
678
+ box-shadow: 0 0 20px var(--accent-glow);
679
+ }
680
+
681
+ .comparison-card.ours .comparison-fill {
682
+ background: var(--gradient-1);
683
+ box-shadow: 0 0 20px var(--primary-glow);
684
+ }
685
+
686
+ .comparison-meta {
687
+ color: var(--text-secondary);
688
+ font-size: 1rem;
689
+ display: flex;
690
+ justify-content: space-between;
691
+ border-top: 1px solid rgba(255, 255, 255, 0.05);
692
+ padding-top: 20px;
693
+ margin-top: 20px;
694
+ }
695
+
696
+ .table-container {
697
+ background: var(--bg-card);
698
+ border: 1px solid var(--border);
699
+ border-radius: 30px;
700
+ padding: 48px;
701
+ overflow-x: auto;
702
+ backdrop-filter: blur(10px);
703
+ box-shadow: 0 30px 80px rgba(0, 0, 0, 0.3);
704
+ }
705
+
706
+ table {
707
+ width: 100%;
708
+ border-collapse: separate;
709
+ border-spacing: 0;
710
+ }
711
+
712
+ th {
713
+ text-align: left;
714
+ padding: 24px;
715
+ color: var(--text-secondary);
716
+ font-weight: 600;
717
+ text-transform: uppercase;
718
+ font-size: 0.9rem;
719
+ letter-spacing: 1.5px;
720
+ border-bottom: 1px solid var(--border);
721
+ }
722
+
723
+ td {
724
+ padding: 28px 24px;
725
+ border-bottom: 1px solid rgba(255, 255, 255, 0.03);
726
+ font-weight: 500;
727
+ font-size: 1.05rem;
728
+ }
729
+
730
+ tr:last-child td {
731
+ border-bottom: none;
732
+ }
733
+
734
+ tr.highlight-row {
735
+ background: rgba(255, 142, 83, 0.1);
736
+ }
737
+
738
+ tr.highlight-row td {
739
+ color: white;
740
+ font-weight: 700;
741
+ }
742
+
743
+ tr.highlight-row td:first-child {
744
+ border-left: 4px solid var(--primary);
745
+ }
746
+
747
+ .rank-circle {
748
+ width: 40px;
749
+ height: 40px;
750
+ border-radius: 50%;
751
+ background: rgba(255, 255, 255, 0.05);
752
+ display: flex;
753
+ align-items: center;
754
+ justify-content: center;
755
+ font-weight: 700;
756
+ font-size: 1rem;
757
+ }
758
+
759
+ .rank-1 {
760
+ background: linear-gradient(135deg, #FFD700, #FFA500);
761
+ color: black;
762
+ box-shadow: 0 0 20px rgba(255, 215, 0, 0.3);
763
+ }
764
+
765
+ .rank-2 {
766
+ background: linear-gradient(135deg, #E0E0E0, #BDBDBD);
767
+ color: black;
768
+ box-shadow: 0 0 20px rgba(192, 192, 192, 0.3);
769
+ }
770
+
771
+ .rank-3 {
772
+ background: linear-gradient(135deg, #CD7F32, #8B4513);
773
+ color: white;
774
+ box-shadow: 0 0 20px rgba(205, 127, 50, 0.3);
775
+ }
776
+
777
+ .chart-grid {
778
+ display: grid;
779
+ grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
780
+ gap: 48px;
781
+ margin: 80px 0;
782
+ }
783
+
784
+ .chart-card {
785
+ background: var(--bg-card);
786
+ border: 1px solid var(--border);
787
+ border-radius: 30px;
788
+ padding: 40px;
789
+ transition: transform 0.3s;
790
+ }
791
+
792
+ .chart-card:hover {
793
+ transform: translateY(-8px);
794
+ border-color: rgba(255, 255, 255, 0.2);
795
+ }
796
+
797
+ .arch-grid {
798
+ display: grid;
799
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
800
+ gap: 24px;
801
+ margin: 80px 0;
802
+ }
803
+
804
+ .arch-item {
805
+ background: rgba(255, 255, 255, 0.02);
806
+ border: 1px solid var(--border);
807
+ border-radius: 24px;
808
+ padding: 36px 24px;
809
+ text-align: center;
810
+ transition: all 0.3s;
811
+ }
812
+
813
+ .arch-item:hover {
814
+ background: rgba(255, 255, 255, 0.05);
815
+ transform: translateY(-8px);
816
+ border-color: var(--accent);
817
+ box-shadow: 0 10px 30px var(--accent-glow);
818
+ }
819
+
820
+ .arch-value {
821
+ display: block;
822
+ font-size: 2rem;
823
+ font-weight: 700;
824
+ margin-top: 12px;
825
+ background: var(--gradient-2);
826
+ -webkit-background-clip: text;
827
+ -webkit-text-fill-color: transparent;
828
+ }
829
+
830
+ .arch-label {
831
+ color: var(--text-secondary);
832
+ font-size: 0.95rem;
833
+ text-transform: uppercase;
834
+ letter-spacing: 1px;
835
+ }
836
+
837
+ .code-wrapper {
838
+ background: #0d0d14;
839
+ border-radius: 24px;
840
+ border: 1px solid var(--border);
841
+ overflow: hidden;
842
+ position: relative;
843
+ margin: 60px 0;
844
+ box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
845
+ }
846
+
847
+ .code-header {
848
+ display: flex;
849
+ justify-content: space-between;
850
+ align-items: center;
851
+ padding: 18px 28px;
852
+ background: rgba(255, 255, 255, 0.03);
853
+ border-bottom: 1px solid var(--border);
854
+ }
855
+
856
+ .window-dots {
857
+ display: flex;
858
+ gap: 10px;
859
+ }
860
+
861
+ .dot {
862
+ width: 14px;
863
+ height: 14px;
864
+ border-radius: 50%;
865
+ }
866
+
867
+ .dot-red {
868
+ background: #FF5F56;
869
+ box-shadow: 0 0 10px rgba(255, 95, 86, 0.4);
870
+ }
871
+
872
+ .dot-yellow {
873
+ background: #FFBD2E;
874
+ box-shadow: 0 0 10px rgba(255, 189, 46, 0.4);
875
+ }
876
+
877
+ .dot-green {
878
+ background: #27C93F;
879
+ box-shadow: 0 0 10px rgba(39, 201, 63, 0.4);
880
+ }
881
+
882
+ .copy-btn {
883
+ background: transparent;
884
+ border: 1px solid var(--border);
885
+ color: var(--text-secondary);
886
+ padding: 8px 16px;
887
+ border-radius: 10px;
888
+ cursor: pointer;
889
+ font-size: 0.85rem;
890
+ transition: all 0.2s;
891
+ display: flex;
892
+ align-items: center;
893
+ gap: 8px;
894
+ }
895
+
896
+ .copy-btn:hover {
897
+ background: rgba(255, 255, 255, 0.1);
898
+ color: white;
899
+ border-color: white;
900
+ }
901
+
902
+ pre {
903
+ padding: 32px;
904
+ overflow-x: auto;
905
+ font-family: 'JetBrains Mono', monospace;
906
+ font-size: 1rem;
907
+ line-height: 1.7;
908
+ }
909
+
910
+ code {
911
+ color: #e0e0e0;
912
+ }
913
+
914
+ .kwd {
915
+ color: #ff79c6;
916
+ }
917
+
918
+ .str {
919
+ color: #f1fa8c;
920
+ }
921
+
922
+ .com {
923
+ color: #6272a4;
924
+ }
925
+
926
+ .func {
927
+ color: #50fa7b;
928
+ }
929
+
930
+ footer {
931
+ border-top: 1px solid var(--border);
932
+ padding: 100px 0 50px;
933
+ text-align: center;
934
+ background: rgba(3, 3, 5, 0.9);
935
+ }
936
+
937
+ .social-links {
938
+ display: flex;
939
+ justify-content: center;
940
+ gap: 24px;
941
+ margin: 40px 0;
942
+ }
943
+
944
+ .social-btn {
945
+ width: 56px;
946
+ height: 56px;
947
+ border-radius: 50%;
948
+ background: rgba(255, 255, 255, 0.03);
949
+ display: flex;
950
+ align-items: center;
951
+ justify-content: center;
952
+ color: white;
953
+ text-decoration: none;
954
+ transition: all 0.3s;
955
+ border: 1px solid var(--border);
956
+ font-size: 1.2rem;
957
+ }
958
+
959
+ .social-btn:hover {
960
+ background: var(--gradient-1);
961
+ transform: translateY(-6px);
962
+ border-color: transparent;
963
+ box-shadow: 0 10px 30px var(--primary-glow);
964
+ }
965
+
966
+ .hf-icon {
967
+ width: 28px;
968
+ height: 28px;
969
+ fill: currentColor;
970
+ }
971
+
972
+ .fade-up {
973
+ opacity: 0;
974
+ transform: translateY(40px);
975
+ transition: all 1s cubic-bezier(0.2, 0.8, 0.2, 1);
976
+ }
977
+
978
+ .fade-up.visible {
979
+ opacity: 1;
980
+ transform: translateY(0);
981
+ }
982
+
983
+ @media (max-width: 768px) {
984
+ .hero h1 {
985
+ font-size: 4rem;
986
+ }
987
+
988
+ .hero-stats {
989
+ gap: 40px;
990
+ }
991
+
992
+ .hero-stat::after {
993
+ display: none;
994
+ }
995
+
996
+ .comparison-grid {
997
+ grid-template-columns: 1fr;
998
+ }
999
+
1000
+ .chart-grid {
1001
+ grid-template-columns: 1fr;
1002
+ }
1003
+ }
1004
+ </style>
1005
+ </head>
1006
+
1007
+ <body>
1008
+ <div class="scroll-progress" id="scrollProgress"></div>
1009
+ <div class="bg-orb orb-1"></div>
1010
+ <div class="bg-orb orb-2"></div>
1011
+ <div class="bg-orb orb-3"></div>
1012
+
1013
+ <div id="imageModal" class="modal" onclick="closeModal()">
1014
+ <span class="modal-close">&times;</span>
1015
+ <img id="modalImg" src="" alt="Zoomed Figure">
1016
+ </div>
1017
+
1018
+ <nav id="navbar">
1019
+ <div class="container">
1020
+ <div class="logo">Gumini <span
1021
+ style="font-size: 0.6em; font-weight: 500; color: var(--text-secondary);">(구미니)</span></div>
1022
+ <ul class="nav-links">
1023
+ <li><a href="#overview">Overview</a></li>
1024
+ <li><a href="#efficiency">Efficiency</a></li>
1025
+ <li><a href="#results">Results</a></li>
1026
+ <li><a href="#architecture">Architecture</a></li>
1027
+ <li>
1028
+ <div class="lang-toggle">
1029
+ <button class="lang-btn active" data-lang="en">EN</button>
1030
+ <button class="lang-btn" data-lang="kr">KR</button>
1031
+ </div>
1032
+ </li>
1033
+ </ul>
1034
+ </div>
1035
+ </nav>
1036
+
1037
+ <section class="hero" id="overview">
1038
+ <div class="hero-content">
1039
+ <div class="hero-badge fade-up">
1040
+ <i class="fas fa-bolt"></i>
1041
+ <span>Research Preview</span>
1042
+ </div>
1043
+ <h1 class="fade-up">
1044
+ <span data-en="Gumini" data-kr="Gumini">Gumini</span><span class="sub-name">(구미니)</span>
1045
+ </h1>
1046
+ <p class="hero-subtitle fade-up"
1047
+ data-en="Gumini outperforms Qwen-2.5-1.5B with 5,732× less data and surpasses the 2x larger Llama-3.2-3B with 2,866× less data.<br>The new standard for data-efficient Korean LLMs."
1048
+ data-kr="Gumini는 5,732배 적은 데이터로 Qwen-2.5-1.5B를 뛰어넘고<br>2,866배 적은 데이터로 2배 더 큰 Llama-3.2-3B를 능가합니다.<br>데이터 효율적 한국어 LLM의 새로운 기준.">
1049
+ Gumini outperforms Qwen-2.5-1.5B with 5,732× less data and surpasses the 2x larger Llama-3.2-3B with
1050
+ 2,866× less data.<br>
1051
+ The new standard for data-efficient Korean LLMs.
1052
+ </p>
1053
+
1054
+ <div class="hero-stats fade-up">
1055
+ <div class="hero-stat">
1056
+ <div class="hero-stat-value">3.14B</div>
1057
+ <div class="hero-stat-label">Training Tokens</div>
1058
+ </div>
1059
+ <div class="hero-stat">
1060
+ <div class="hero-stat-value">8.49</div>
1061
+ <div class="hero-stat-label">Perplexity</div>
1062
+ </div>
1063
+ <div class="hero-stat">
1064
+ <div class="hero-stat-value">#3</div>
1065
+ <div class="hero-stat-label">Overall Rank</div>
1066
+ </div>
1067
+ </div>
1068
+
1069
+ <div class="hero-buttons fade-up">
1070
+ <a href="https://huggingface.co/GuminiResearch/Gumini-1.5B-Base" class="btn btn-primary"
1071
+ target="_blank">
1072
+ <img src="assets/huggingface.png" class="hf-icon" alt="Hugging Face">
1073
+ Gumini-1.5B
1074
+ </a>
1075
+ <a href="https://huggingface.co/GuminiResearch/Gumini-1B-Base" class="btn btn-secondary"
1076
+ style="border: 1px solid rgba(255,255,255,0.2);" target="_blank">
1077
+ <img src="assets/huggingface.png" class="hf-icon" alt="Hugging Face"
1078
+ style="width: 18px; height: 18px;">
1079
+ Gumini-1B
1080
+ </a>
1081
+ <a href="https://huggingface.co/GuminiResearch/Gumini-1.5B-Base-i1-GGUF" class="btn btn-secondary"
1082
+ style="border: 1px solid rgba(255,255,255,0.2);" target="_blank">
1083
+ <i class="fas fa-cube"></i> GGUF
1084
+ </a>
1085
+ <a href="https://www.linkedin.com/in/devgumin" class="btn btn-secondary" target="_blank">
1086
+ <i class="fab fa-linkedin-in"></i> LinkedIn
1087
+ </a>
1088
+ </div>
1089
+ </div>
1090
+ </section>
1091
+
1092
+ <section id="features" class="section">
1093
+ <div class="container">
1094
+ <h2 class="section-title" style="text-align: center;" data-en="Evaluation Methodology">
1095
+ Evaluation <span class="gradient-text">Methodology</span></h2>
1096
+ <p class="section-desc" style="text-align: center;"
1097
+ data-en="I evaluated model performance to ensure robustness in Korean contexts."
1098
+ data-kr="한국어 문맥에서의 견고함을 보장하기 위해 모델 성능을 평가했습니다.">
1099
+ I evaluated model performance to ensure robustness in Korean contexts.
1100
+ </p>
1101
+
1102
+ <div class="comparison-grid"
1103
+ style="grid-template-columns: repeat(2, 1fr); margin-bottom: 60px; justify-content: center; max-width: 800px; margin-left: auto; margin-right: auto;">
1104
+ <div class="comparison-card">
1105
+ <h4><i class="fas fa-database"></i> KoBEST BoolQ</h4>
1106
+ <div class="stat-value" style="font-size: 1.2rem; margin: 10px 0;" data-en="Korean Standard"
1107
+ data-kr="Korean Standard">Korean Standard</div>
1108
+ <p style="color: var(--text-secondary); font-size: 0.9rem;"
1109
+ data-en="Standard Korean Boolean QA benchmark test split."
1110
+ data-kr="Standard Korean Boolean QA benchmark test split.">
1111
+ Standard Korean Boolean QA benchmark test split.
1112
+ </p>
1113
+ </div>
1114
+ <div class="comparison-card">
1115
+ <h4><i class="fab fa-wikipedia-w"></i> Wikipedia KO</h4>
1116
+ <div class="stat-value" style="font-size: 1.2rem; margin: 10px 0;" data-en="Recent Held-Out"
1117
+ data-kr="Recent Ko-wiki">Recent Ko-wiki</div>
1118
+ <p style="color: var(--text-secondary); font-size: 0.9rem;"
1119
+ data-en="Latest Korean Wikipedia dump for language modeling."
1120
+ data-kr="Latest Korean Wikipedia dump for language modeling.">
1121
+ Latest Korean Wikipedia dump for language modeling.
1122
+ </p>
1123
+ </div>
1124
+ </div>
1125
+
1126
+ <h2 class="section-title" style="text-align: center;" data-en="Data Efficiency Revolution">Data Efficiency
1127
+ <span class="gradient-text">Revolution</span>
1128
+ </h2>
1129
+ <p class="section-desc" style="text-align: center;"
1130
+ data-en="Standard LLMs waste compute on redundant &ldquo;lazy layers&rdquo; in deeper networks. <br> Inheritune solves this by inheriting potent early layers and progressively expanding achieving comparable performance with far fewer parameters and tokens."
1131
+ data-kr="표준 LLM은 깊은 네트워크의 비효율적인 &ldquo;Lazy Layer&rdquo;에 컴퓨팅을 낭비합니다.<br>Inheritune는 초기 레이어를 상속받고 점진적으로 확장하여 훨씬 적은 파라미터와 토큰으로 동등한 성능을 달성합니다.">
1132
+ Standard LLMs waste compute on redundant "lazy layers" in deeper networks. Inheritune solves this by
1133
+ inheriting potent early layers and progressively expanding achieving comparable performance with far
1134
+ fewer parameters and tokens.
1135
+ </p>
1136
+ </div>
1137
+ </section>
1138
+
1139
+ <div class="container">
1140
+ <div class="highlight-box fade-up">
1141
+ <h3 style="font-size: 1.2rem; font-weight: 600; color: var(--text-secondary); margin-bottom: 15px;"
1142
+ data-en="Key Achievement" data-kr="Key Achievement
1143
+ ">Key Achievement</h3>
1144
+ <div class="highlight-number shimmer">5,732×</div>
1145
+ <p style="font-size: 1.5rem; color: white; font-weight: 600;"
1146
+ data-en="More Data Efficient than Qwen-2.5-1.5B" data-kr="Qwen-2.5-1.5B 대비 뛰어난 데이터 효율성">
1147
+ More Data Efficient than Qwen-2.5-1.5B
1148
+ </p>
1149
+ <p style="color: var(--text-secondary); margin-top: 12px; font-size: 1.1rem;"
1150
+ data-en="Gumini-1.5B (PPL 8.49) surpasses Qwen-2.5-1.5B (PPL 8.84) at the same scale with 5,732× less data."
1151
+ data-kr="Gumini-1.5B (PPL 8.49)는 동일 규모에서 5,732배 적은 데이터로 Qwen-2.5-1.5B (PPL 8.84)를 능가합니다.">
1152
+ Gumini-1.5B (PPL 8.49) surpasses Qwen-2.5-1.5B (PPL 8.84) at the same scale with 5,732× less data.
1153
+ </p>
1154
+ </div>
1155
+ </div>
1156
+
1157
+ <section id="efficiency">
1158
+ <div class="container">
1159
+ <div class="section-header fade-up">
1160
+ <div class="section-tag">DATA EFFICIENCY</div>
1161
+ <h2 class="section-title" data-en="Doing More With Less">Doing More With
1162
+ Less</h2>
1163
+ <p class="section-desc"
1164
+ data-en="Gumini demonstrates that smart architectural choices and curriculum learning can dramatically reduce data requirements."
1165
+ data-kr="Gumini는 똑똑한 아키텍처 설계와 커리큘럼 학습이 데이터 요구량을 획기적으로 줄일 수 있음을 증명합니다.">
1166
+ Gumini demonstrates that smart architectural choices and curriculum learning can dramatically reduce
1167
+ data requirements.
1168
+ </p>
1169
+ </div>
1170
+
1171
+ <div class="comparison-grid">
1172
+ <div class="comparison-card fade-up">
1173
+ <h4>Qwen-2.5-7B <span style="font-size: 0.8rem; color: var(--text-secondary);">Alibaba</span></h4>
1174
+ <div class="comparison-tokens">18T</div>
1175
+ <div class="comparison-bar">
1176
+ <div class="comparison-fill" style="width: 100%"></div>
1177
+ </div>
1178
+ <p class="comparison-meta">
1179
+ <span>Data Usage</span>
1180
+ <span style="color: var(--primary);">5,732×</span>
1181
+ </p>
1182
+ </div>
1183
+
1184
+ <div class="comparison-card fade-up">
1185
+ <h4>Qwen-2.5-1.5B <span style="font-size: 0.8rem; color: var(--text-secondary);">Alibaba</span></h4>
1186
+ <div class="comparison-tokens">18T</div>
1187
+ <div class="comparison-bar">
1188
+ <div class="comparison-fill" style="width: 100%"></div>
1189
+ </div>
1190
+ <p class="comparison-meta">
1191
+ <span>Data Usage</span>
1192
+ <span style="color: var(--primary);">5,732×</span>
1193
+ </p>
1194
+ </div>
1195
+
1196
+ <div class="comparison-card fade-up">
1197
+ <h4>Qwen-2.5-0.5B <span style="font-size: 0.8rem; color: var(--text-secondary);">Alibaba</span></h4>
1198
+ <div class="comparison-tokens">18T</div>
1199
+ <div class="comparison-bar">
1200
+ <div class="comparison-fill" style="width: 100%"></div>
1201
+ </div>
1202
+ <p class="comparison-meta">
1203
+ <span>Data Usage</span>
1204
+ <span style="color: var(--primary);">5,732×</span>
1205
+ </p>
1206
+ </div>
1207
+
1208
+ <div class="comparison-card fade-up">
1209
+ <h4>EXAONE-3.5-2.4B <span style="font-size: 0.8rem; color: var(--text-secondary);">LG AI</span></h4>
1210
+ <div class="comparison-tokens">~6.5T</div>
1211
+ <div class="comparison-bar">
1212
+ <div class="comparison-fill" style="width: 36%"></div>
1213
+ </div>
1214
+ <p class="comparison-meta">
1215
+ <span>Data Usage</span>
1216
+ <span style="color: var(--primary);">~2,070×</span>
1217
+ </p>
1218
+ </div>
1219
+
1220
+ <div class="comparison-card fade-up">
1221
+ <h4>Llama-3.2-3B <span style="font-size: 0.8rem; color: var(--text-secondary);">Meta</span></h4>
1222
+ <div class="comparison-tokens">9T</div>
1223
+ <div class="comparison-bar">
1224
+ <div class="comparison-fill" style="width: 50%"></div>
1225
+ </div>
1226
+ <p class="comparison-meta">
1227
+ <span data-en="Data Usage" data-kr="데이터 사용량">Data Usage</span>
1228
+ <span style="color: var(--primary);">2,866×</span>
1229
+ </p>
1230
+ </div>
1231
+
1232
+ <div class="comparison-card fade-up">
1233
+ <h4>Llama-3.2-1B <span style="font-size: 0.8rem; color: var(--text-secondary);">Meta</span></h4>
1234
+ <div class="comparison-tokens">9T</div>
1235
+ <div class="comparison-bar">
1236
+ <div class="comparison-fill" style="width: 50%"></div>
1237
+ </div>
1238
+ <p class="comparison-meta">
1239
+ <span>Data Usage</span>
1240
+ <span style="color: var(--primary);">2,866×</span>
1241
+ </p>
1242
+ </div>
1243
+
1244
+ <div class="comparison-card fade-up">
1245
+ <h4>Gemma-2B <span style="font-size: 0.8rem; color: var(--text-secondary);">Google</span></h4>
1246
+ <div class="comparison-tokens">2T</div>
1247
+ <div class="comparison-bar">
1248
+ <div class="comparison-fill" style="width: 11%"></div>
1249
+ </div>
1250
+ <p class="comparison-meta">
1251
+ <span data-en="Data Usage" data-kr="데이터 사용량">Data Usage</span>
1252
+ <span style="color: var(--primary);">637×</span>
1253
+ </p>
1254
+ </div>
1255
+
1256
+ <div class="comparison-card fade-up">
1257
+ <h4>BLOOM-1.1B <span style="font-size: 0.8rem; color: var(--text-secondary);">BigScience</span></h4>
1258
+ <div class="comparison-tokens">350B</div>
1259
+ <div class="comparison-bar">
1260
+ <div class="comparison-fill" style="width: 2%"></div>
1261
+ </div>
1262
+ <p class="comparison-meta">
1263
+ <span data-en="Data Usage" data-kr="데이터 사용량">Data Usage</span>
1264
+ <span style="color: var(--primary);">111×</span>
1265
+ </p>
1266
+ </div>
1267
+
1268
+ <div class="comparison-card fade-up">
1269
+ <h4>Polyglot-Ko-1.3B <span
1270
+ style="font-size: 0.8rem; color: var(--text-secondary);">EleutherAI</span></h4>
1271
+ <div class="comparison-tokens">213B</div>
1272
+ <div class="comparison-bar">
1273
+ <div class="comparison-fill" style="width: 1.2%"></div>
1274
+ </div>
1275
+ <p class="comparison-meta">
1276
+ <span data-en="Data Usage" data-kr="데이터 사용량">Data Usage</span>
1277
+ <span style="color: var(--primary);">68×</span>
1278
+ </p>
1279
+ </div>
1280
+
1281
+ <div class="comparison-card ours fade-up">
1282
+ <h4>Gumini-1.5B <span class="badge-ours">Ours</span></h4>
1283
+ <div class="comparison-tokens"
1284
+ style="background: var(--gradient-1); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">
1285
+ 3.14B</div>
1286
+ <div class="comparison-bar">
1287
+ <div class="comparison-fill" style="width: 0.02%; background: var(--gradient-1);"></div>
1288
+ </div>
1289
+ <p class="comparison-meta">
1290
+ <span data-en="Data Usage" data-kr="데이터 사용량">Data Usage</span>
1291
+ <span style="color: var(--accent);">Baseline (1×)</span>
1292
+ </p>
1293
+ </div>
1294
+
1295
+ </div>
1296
+ </div>
1297
+ </div>
1298
+ </section>
1299
+
1300
+ <section id="results">
1301
+ <div class="container">
1302
+ <div class="section-header fade-up">
1303
+ <div class="section-tag">BENCHMARKS</div>
1304
+ <h2 class="section-title" data-en="Performance Comparison">Performance Comparison
1305
+ </h2>
1306
+ <p class="section-desc"
1307
+ data-en="Evaluated on Korean benchmarks. <br> Gumini outperforms larger models trained on significantly more data."
1308
+ data-kr="한국어 벤치마크에서 평가를 진행했습니다. <br> Gumini는 훨씬 많은 데이터로 학습된 더 큰 모델들보다 뛰어난 성능을 보입니다.">
1309
+ Evaluated on Korean benchmarks. <br>Gumini outperforms larger models trained on significantly more
1310
+ data.
1311
+ </p>
1312
+ </div>
1313
+
1314
+ <div class="table-container fade-up">
1315
+ <table>
1316
+ <thead>
1317
+ <tr>
1318
+ <th>RANK</th>
1319
+ <th>MODEL</th>
1320
+ <th>PARAMS</th>
1321
+ <th>OVERALL PPL</th>
1322
+ <th>OVERALL TOP-1 ACC</th>
1323
+ <th>TOP-5 ACC</th>
1324
+ <th>OVERALL ↑</th>
1325
+ </tr>
1326
+ </thead>
1327
+ <tbody>
1328
+ <tr class="rank-1">
1329
+ <td>#1</td>
1330
+ <td>Qwen-2.5-7B</td>
1331
+ <td>7.62B</td>
1332
+ <td>6.39</td>
1333
+ <td>58.8%</td>
1334
+ <td>79.7%</td>
1335
+ <td>0.8003</td>
1336
+ </tr>
1337
+ <tr class="rank-2">
1338
+ <td>#2</td>
1339
+ <td>Gemma-2B</td>
1340
+ <td>2B</td>
1341
+ <td>8.15</td>
1342
+ <td>54.9%</td>
1343
+ <td>76.5%</td>
1344
+ <td>0.7759</td>
1345
+ </tr>
1346
+ <tr class="highlight-row rank-3">
1347
+ <td style="color:white;">#3</td>
1348
+ <td style="color:white;"><i class="fas fa-paw"
1349
+ style="margin-right:8px; color:#FF8E53;"></i>Gumini-1.5B</td>
1350
+ <td style="color:white;">1.54B</td>
1351
+ <td style="color:white; font-weight:800;">8.49</td>
1352
+ <td style="color:white;">53.6%</td>
1353
+ <td style="color:white;">74.8%</td>
1354
+ <td style="color:white; font-weight:800;">0.7662</td>
1355
+ </tr>
1356
+ <tr>
1357
+ <td>#4</td>
1358
+ <td>Qwen-2.5-1.5B</td>
1359
+ <td>1.5B</td>
1360
+ <td>8.84</td>
1361
+ <td>53.3%</td>
1362
+ <td>74.6%</td>
1363
+ <td>0.7639</td>
1364
+ </tr>
1365
+ <tr>
1366
+ <td>#5</td>
1367
+ <td>Llama-3.2-3B</td>
1368
+ <td>3.21B</td>
1369
+ <td>9.47</td>
1370
+ <td>53.0%</td>
1371
+ <td>74.6%</td>
1372
+ <td>0.7671</td>
1373
+ </tr>
1374
+ <tr>
1375
+ <td>#6</td>
1376
+ <td>EXAONE-3.5-2.4B</td>
1377
+ <td>2.4B</td>
1378
+ <td>9.80</td>
1379
+ <td>54.0%</td>
1380
+ <td>76.1%</td>
1381
+ <td>0.7766</td>
1382
+ </tr>
1383
+ <tr class="highlight-row">
1384
+ <td style="color:white;">#7</td>
1385
+ <td style="color:white;"><i class="fas fa-paw"
1386
+ style="margin-right:8px; color:#FF8E53;"></i>Gumini-1B</td>
1387
+ <td style="color:white;">1.08B</td>
1388
+ <td style="color:white;">11.19</td>
1389
+ <td style="color:white;">49.5%</td>
1390
+ <td style="color:white;">70.7%</td>
1391
+ <td style="color:white; font-weight:800;">0.6971</td>
1392
+ </tr>
1393
+ <tr>
1394
+ <td>#8</td>
1395
+ <td>Llama-3.2-1B</td>
1396
+ <td>1.24B</td>
1397
+ <td>12.14</td>
1398
+ <td>49.4%</td>
1399
+ <td>70.8%</td>
1400
+ <td>0.6720</td>
1401
+ </tr>
1402
+ <tr>
1403
+ <td>#9</td>
1404
+ <td>Qwen-2.5-0.5B</td>
1405
+ <td>0.5B</td>
1406
+ <td>13.37</td>
1407
+ <td>47.2%</td>
1408
+ <td>68.5%</td>
1409
+ <td>0.6240</td>
1410
+ </tr>
1411
+ <tr>
1412
+ <td>#10</td>
1413
+ <td>BLOOM-1.1B</td>
1414
+ <td>1.1B</td>
1415
+ <td>16.03</td>
1416
+ <td>41.9%</td>
1417
+ <td>64.6%</td>
1418
+ <td>0.5365</td>
1419
+ </tr>
1420
+ <tr>
1421
+ <td>#11</td>
1422
+ <td>Polyglot-Ko-1.3B</td>
1423
+ <td>1.3B</td>
1424
+ <td>25.05</td>
1425
+ <td>48.6%</td>
1426
+ <td>69.1%</td>
1427
+ <td>0.4889</td>
1428
+ </tr>
1429
+ </tbody>
1430
+ </table>
1431
+ </div>
1432
+
1433
+ <div style="margin-top: 80px;">
1434
+ <h3 style="text-align: center; margin-bottom: 40px; font-size: 1.8rem;"
1435
+ data-en="Data Efficiency Comparison">Data Efficiency <span class="gradient-text">Comparison</span>
1436
+ </h3>
1437
+ <div class="table-container">
1438
+ <table class="comparison-table">
1439
+ <thead>
1440
+ <tr>
1441
+ <th data-en="Model">Model</th>
1442
+ <th data-en="Training Tokens">Training Tokens</th>
1443
+ <th data-en="Efficiency Multiplier (vs Gumini)">Efficiency
1444
+ Multiplier (vs Gumini)</th>
1445
+ <th data-en="Calculation">Calculation</th>
1446
+ </tr>
1447
+ </thead>
1448
+ <tbody>
1449
+ <tr>
1450
+ <td>Qwen-2.5-7B</td>
1451
+ <td>18T</td>
1452
+ <td style="color: #F72585; font-weight: 700;">5,732×</td>
1453
+ <td style="color: var(--text-secondary);">18,000B ÷ 3.14B</td>
1454
+ </tr>
1455
+ <tr>
1456
+ <td>Qwen-2.5-1.5B</td>
1457
+ <td>18T</td>
1458
+ <td style="color: #F72585; font-weight: 700;">5,732×</td>
1459
+ <td style="color: var(--text-secondary);">18,000B ÷ 3.14B</td>
1460
+ </tr>
1461
+ <tr>
1462
+ <td>Qwen-2.5-0.5B</td>
1463
+ <td>18T</td>
1464
+ <td style="color: #F72585; font-weight: 700;">5,732×</td>
1465
+ <td style="color: var(--text-secondary);">18,000B ÷ 3.14B</td>
1466
+ </tr>
1467
+ <tr>
1468
+ <td>Llama-3.2-3B</td>
1469
+ <td>9T</td>
1470
+ <td style="color: #FF8E53; font-weight: 700;">2,866×</td>
1471
+ <td style="color: var(--text-secondary);">9,000B ÷ 3.14B</td>
1472
+ </tr>
1473
+ <tr>
1474
+ <td>Llama-3.2-1B</td>
1475
+ <td>9T</td>
1476
+ <td style="color: #FF8E53; font-weight: 700;">2,866×</td>
1477
+ <td style="color: var(--text-secondary);">9,000B ÷ 3.14B</td>
1478
+ </tr>
1479
+ <tr>
1480
+ <td>EXAONE-3.5-2.4B</td>
1481
+ <td>~6.5T</td>
1482
+ <td style="font-weight: 700;">~2,070×</td>
1483
+ <td style="color: var(--text-secondary);">6,500B ÷ 3.14B</td>
1484
+ </tr>
1485
+ <tr>
1486
+ <td>Gemma-2B</td>
1487
+ <td>2T</td>
1488
+ <td style="font-weight: 700;">637×</td>
1489
+ <td style="color: var(--text-secondary);">2,000B ÷ 3.14B</td>
1490
+ </tr>
1491
+ <tr>
1492
+ <td>BLOOM-1.1B</td>
1493
+ <td>350B</td>
1494
+ <td style="font-weight: 700;">111×</td>
1495
+ <td style="color: var(--text-secondary);">350B ÷ 3.14B</td>
1496
+ </tr>
1497
+ <tr>
1498
+ <td>Polyglot-Ko-1.3B</td>
1499
+ <td>213B</td>
1500
+ <td style="font-weight: 700;">68×</td>
1501
+ <td style="color: var(--text-secondary);">213B ÷ 3.14B</td>
1502
+ </tr>
1503
+ </tbody>
1504
+ </table>
1505
+ </div>
1506
+ </div>
1507
+
1508
+ <div style="margin: 100px 0;">
1509
+ <h3 style="text-align: center; margin-bottom: 40px; font-size: 1.8rem;"
1510
+ data-en="Training Method: Inheritune">Training Method: <span class="gradient-text">Inheritune</span>
1511
+ </h3>
1512
+ <p style="text-align: center; color: var(--text-secondary); max-width: 800px; margin: 0 auto 60px;"
1513
+ data-en="&ldquo;Less is More.&rdquo; Gumini uses a progressive training strategy where layers are added incrementally, ensuring maximum efficiency."
1514
+ data-kr="&ldquo;Less is More.&rdquo; Gumini는 레이어를 점진적으로 추가하는 전략을 사용하여 효율성을 극대화합니다.">
1515
+ "Less is More." Gumini uses a progressive training strategy where layers are added incrementally,
1516
+ ensuring maximum efficiency.
1517
+ </p>
1518
+
1519
+ <div class="comparison-grid" style="grid-template-columns: 1fr 1fr; gap: 40px; align-items: stretch;">
1520
+ <div class="comparison-card"
1521
+ style="text-align: left; min-height: 280px; display: flex; flex-direction: column;">
1522
+ <h4 style="color: var(--accent); margin-bottom: 20px;" data-en="Core Philosophy">Core Philosophy
1523
+ </h4>
1524
+ <p style="color: var(--text); font-size: 1.05rem; line-height: 1.8; flex-grow: 1;"
1525
+ data-en='Standard LLMs have inefficient &ldquo;lazy layers&rdquo; in deeper networks. Inheritune initializes a compact model by inheriting potent early layers from a larger pre-trained model, then progressively retrains and expands it, achieving comparable or better performance with significantly fewer layers.'
1526
+ data-kr='표준 LLM에는 깊은 네트워크에 비효율적인 &ldquo;Lazy Layer&rdquo;가 있습니다. Inheritune은 더 큰 사전학습 모델에서 강력한 초기 레이어를 상속받아 컴팩트 모델을 초기화한 후 점진적으로 재학습하고 확장합니다.'>
1527
+ Standard LLMs have inefficient "lazy layers" in deeper networks. Inheritune initializes a
1528
+ compact model by inheriting potent early layers from a larger pre-trained model, then
1529
+ progressively retrains and expands it, achieving comparable or better performance with
1530
+ significantly fewer layers.
1531
+ </p>
1532
+ <div
1533
+ style="display: flex; gap: 15px; align-items: center; margin-top: auto; padding-top: 20px;">
1534
+ <a href="https://huggingface.co/papers/2404.08634" target="_blank"
1535
+ style="color: var(--primary); text-decoration: none; border-bottom: 1px dashed var(--primary);">
1536
+ <i class="fas fa-book"></i> Read the Paper
1537
+ </a>
1538
+ <button onclick="toggleCitation()"
1539
+ style="background: none; border: none; color: var(--text-secondary); cursor: pointer; font-size: 0.9rem; transition: color 0.3s;">
1540
+ <i class="fas fa-quote-right"></i> Cite
1541
+ </button>
1542
+ </div>
1543
+ <div id="citationBox"
1544
+ style="display: none; margin-top: 15px; background: rgba(0,0,0,0.3); padding: 15px; border-radius: 8px; font-family: 'JetBrains Mono', monospace; font-size: 0.8rem; color: var(--text-secondary); position: relative; border: 1px solid var(--border);">
1545
+ <button onclick="copyCitation()"
1546
+ style="position: absolute; top: 10px; right: 10px; background: none; border: none; color: var(--text-secondary); cursor: pointer; transition: color 0.3s;"
1547
+ title="Copy BibTeX">
1548
+ <i class="far fa-copy"></i>
1549
+ </button>
1550
+ <pre style="margin: 0; white-space: pre-wrap; text-align: left;">
1551
+ @inproceedings{Sanyal2024inheritune,
1552
+ title={Inheritune: Training Smaller Yet More Attentive Language Models},
1553
+ author={Sunny Sanyal and Ravid Shwartz-Ziv and Alexandros G. Dimakis and Sujay Sanghavi},
1554
+ year={2024},
1555
+ url={https://arxiv.org/abs/2404.08634}
1556
+ }</pre>
1557
+ </div>
1558
+ </div>
1559
+
1560
+ <div class="comparison-card"
1561
+ style="margin-top:0; text-align: left; min-height: 280px; background: rgba(255,255,255,0.03);">
1562
+ <h4 style="color: white; margin-bottom: 20px;" data-en="Gumini-1.5B Growth Schedule">Gumini-1.5B
1563
+ Growth Schedule</h4>
1564
+ <ul style="list-style: none; padding: 0; color: var(--text-secondary);">
1565
+ <li style="margin-bottom: 15px; display: flex; justify-content: space-between;">
1566
+ <span>Stage 0 (Start)</span>
1567
+ <span style="color: white;">10 Layers</span>
1568
+ </li>
1569
+ <li style="margin-bottom: 15px; display: flex; justify-content: space-between;">
1570
+ <span>Stage 1-5</span>
1571
+ <span style="color: white;">+1 Layer per stage</span>
1572
+ </li>
1573
+ <li
1574
+ style="margin-bottom: 15px; display: flex; justify-content: space-between; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 15px;">
1575
+ <span style="color: var(--primary); font-weight: 700;">Stage 6 (Final)</span>
1576
+ <span style="color: var(--primary); font-weight: 700;">16 Layers (3.14B Tokens)</span>
1577
+ </li>
1578
+ </ul>
1579
+ </div>
1580
+ </div>
1581
+ </div>
1582
+
1583
+ <div class="chart-grid">
1584
+ <div class="chart-card fade-up">
1585
+ <canvas id="pplChart"></canvas>
1586
+ </div>
1587
+ <div class="chart-card fade-up">
1588
+ <canvas id="scoreChart"></canvas>
1589
+ </div>
1590
+ </div>
1591
+ </div>
1592
+ </section>
1593
+
1594
+ <section class="section" style="background: rgba(255,255,255,0.02);">
1595
+ <div class="container">
1596
+ <h2 class="section-title" data-en="Benchmark Figures">Benchmark <span class="gradient-text">Figures</span>
1597
+ </h2>
1598
+ <div class="comparison-grid" style="grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));">
1599
+ <div class="comparison-card">
1600
+ <img src="figures/new_ppl_comparison_3.png" alt="PPL Comparison" class="figure-img"
1601
+ onclick="openModal(this.src)" style="width: 100%; border-radius: 10px;">
1602
+ <p style="margin-top: 15px; font-size: 0.9rem; color: var(--text-secondary);"
1603
+ data-en="Perplexity Comparison">Perplexity Comparison
1604
+ </p>
1605
+ </div>
1606
+ <div class="comparison-card">
1607
+ <img src="figures/new_ppl_vs_params_1.png" alt="PPL vs Params" class="figure-img"
1608
+ onclick="openModal(this.src)" style="width: 100%; border-radius: 10px;">
1609
+ <p style="margin-top: 15px; font-size: 0.9rem; color: var(--text-secondary);"
1610
+ data-en="Efficiency Curve (PPL vs Params)">Efficiency Curve (PPL vs Params)
1611
+ </p>
1612
+ </div>
1613
+ <div class="comparison-card">
1614
+ <img src="figures/new_ranking_table_1.png" alt="Ranking Table" class="figure-img"
1615
+ onclick="openModal(this.src)" style="width: 100%; border-radius: 10px;">
1616
+ <p style="margin-top: 15px; font-size: 0.9rem; color: var(--text-secondary);"
1617
+ data-en="Performance Ranking">Performance Ranking
1618
+ </p>
1619
+ </div>
1620
+ </div>
1621
+ </div>
1622
+ </div>
1623
+ </section>
1624
+
1625
+ <section id="architecture">
1626
+ <div class="container">
1627
+ <div class="section-header fade-up">
1628
+ <div class="section-tag">QUICK START</div>
1629
+ <h2 class="section-title" style="text-align: center;" data-en="Usage">Usage</h2>
1630
+ </div>
1631
+
1632
+ <div class="code-wrapper fade-up">
1633
+ <div class="code-header">
1634
+ <div class="window-dots">
1635
+ <div class="dot dot-red"></div>
1636
+ <div class="dot dot-yellow"></div>
1637
+ <div class="dot dot-green"></div>
1638
+ </div>
1639
+ <button class="copy-btn" onclick="copyCode()">
1640
+ <i class="far fa-copy"></i> <span>Copy</span>
1641
+ </button>
1642
+ </div>
1643
+ <pre><code id="codeSnippet"><span class="kwd">from</span> transformers <span class="kwd">import</span> AutoModelForCausalLM, AutoTokenizer
1644
+ <span class="kwd">import</span> torch
1645
+
1646
+ model = AutoModelForCausalLM.<span class="func">from_pretrained</span>(
1647
+ <span class="str">"GuminiResearch/Gumini-1.5B-Base"</span>,
1648
+ torch_dtype=torch.bfloat16,
1649
+ device_map=<span class="str">"auto"</span>
1650
+ )
1651
+ tokenizer = AutoTokenizer.<span class="func">from_pretrained</span>(<span class="str">"GuminiResearch/Gumini-1.5B-Base"</span>)
1652
+
1653
+ prompt = <span class="str">"저는 구미니입니다."</span>
1654
+ inputs = tokenizer(prompt, return_tensors=<span class="str">"pt"</span>).to(model.device)
1655
+
1656
+ outputs = model.<span class="func">generate</span>(
1657
+ **inputs,
1658
+ max_new_tokens=<span class="str">200</span>,
1659
+ repetition_penalty=<span class="str">1.2</span>,
1660
+ do_sample=<span class="kwd">True</span>,
1661
+ temperature=<span class="str">0.7</span>,
1662
+ top_p=<span class="str">0.9</span>,
1663
+ )
1664
+ <span class="func">print</span>(tokenizer.<span class="func">decode</span>(outputs[<span class="str">0</span>], skip_special_tokens=<span class="kwd">True</span>))</code></pre>
1665
+ </div>
1666
+ </div>
1667
+ </section>
1668
+
1669
+ <section class="section" style="background: rgba(255,255,255,0.02);">
1670
+ <div class="container">
1671
+ <div class="section-header fade-up">
1672
+ <div class="section-tag">REFERENCES</div>
1673
+ <h2 class="section-title" style="text-align: center;" data-en="Appendix: Model Sources">Appendix: Model
1674
+ Sources</h2>
1675
+ <p class="section-desc" style="text-align: center;"
1676
+ data-en="Training token counts and source references for benchmark models."
1677
+ data-kr="벤치마크 모델들의 학습 토큰 수와 출처.">
1678
+ Training token counts and source references for benchmark models.
1679
+ </p>
1680
+ </div>
1681
+
1682
+ <div class="table-container fade-up" style="max-width: 900px; margin: 0 auto;">
1683
+ <table class="comparison-table">
1684
+ <thead>
1685
+ <tr>
1686
+ <th>Model</th>
1687
+ <th>Tokens</th>
1688
+ <th>Source</th>
1689
+ </tr>
1690
+ </thead>
1691
+ <tbody>
1692
+ <tr>
1693
+ <td>Qwen-2.5 (7B / 1.5B / 0.5B)</td>
1694
+ <td>18T</td>
1695
+ <td><a href="https://arxiv.org/abs/2412.15115" target="_blank"
1696
+ style="color: var(--primary);">arXiv</a></td>
1697
+ </tr>
1698
+ <tr>
1699
+ <td>Llama-3.2 (3B / 1B)</td>
1700
+ <td>9T</td>
1701
+ <td><a href="https://huggingface.co/meta-llama/Llama-3.2-3B" target="_blank"
1702
+ style="color: var(--primary);">HuggingFace</a></td>
1703
+ </tr>
1704
+ <tr>
1705
+ <td>Gemma-2B</td>
1706
+ <td>2T</td>
1707
+ <td><a href="https://arxiv.org/abs/2408.00118" target="_blank"
1708
+ style="color: var(--primary);">arXiv</a></td>
1709
+ </tr>
1710
+ <tr>
1711
+ <td>EXAONE-3.5-2.4B</td>
1712
+ <td>~6.5T</td>
1713
+ <td><a href="https://arxiv.org/abs/2507.11407" target="_blank"
1714
+ style="color: var(--primary);">arXiv</a></td>
1715
+ </tr>
1716
+ <tr>
1717
+ <td>BLOOM-1.1B</td>
1718
+ <td>350B</td>
1719
+ <td><a href="https://huggingface.co/bigscience/bloom" target="_blank"
1720
+ style="color: var(--primary);">HuggingFace</a></td>
1721
+ </tr>
1722
+ <tr>
1723
+ <td>Polyglot-Ko-1.3B</td>
1724
+ <td>213B</td>
1725
+ <td><a href="https://huggingface.co/EleutherAI/polyglot-ko-1.3b" target="_blank"
1726
+ style="color: var(--primary);">HuggingFace</a></td>
1727
+ </tr>
1728
+ </tbody>
1729
+ </table>
1730
+ </div>
1731
+ </div>
1732
+ </section>
1733
+
1734
+ <section class="section" style="background: rgba(255,255,255,0.02); padding-top: 0;">
1735
+ <div class="container">
1736
+ <div class="evaluation-formulas fade-up" style="max-width: 900px; margin: 0 auto;">
1737
+ <h3 class="section-title" style="text-align: center; font-size: 1.5rem; margin-bottom: 30px;"
1738
+ data-en="Evaluation Metrics">Evaluation Metrics</h3>
1739
+
1740
+ <div
1741
+ style="background: rgba(255,255,255,0.03); padding: 30px; border-radius: 12px; border: 1px solid rgba(255,255,255,0.1);">
1742
+
1743
+ <div style="margin-bottom: 40px;">
1744
+ <h4
1745
+ style="color: var(--text-secondary); margin-bottom: 15px; border-left: 3px solid var(--primary); padding-left: 10px;">
1746
+ Perplexity (PPL)</h4>
1747
+ <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 20px;">
1748
+ <div>
1749
+ <div style="font-size: 0.9rem; color: var(--text-secondary); margin-bottom: 8px;">
1750
+ Per-dataset:</div>
1751
+ <div style="font-size: 1.1rem;">
1752
+ $$ PPL_d = \exp(L_d) $$
1753
+ </div>
1754
+ </div>
1755
+ <div>
1756
+ <div style="font-size: 0.9rem; color: var(--text-secondary); margin-bottom: 8px;">
1757
+ Overall:</div>
1758
+ <div style="font-size: 1.1rem;">
1759
+ $$ PPL_{overall} = \exp\left(\frac{\sum_{d \in D} L_d \cdot T_d}{\sum_{d \in D}
1760
+ T_d}\right) $$
1761
+ </div>
1762
+ </div>
1763
+ </div>
1764
+ </div>
1765
+
1766
+ <div style="margin-bottom: 40px;">
1767
+ <h4
1768
+ style="color: var(--text-secondary); margin-bottom: 15px; border-left: 3px solid var(--accent); padding-left: 10px;">
1769
+ Top-k Accuracy</h4>
1770
+ <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 20px;">
1771
+ <div>
1772
+ <div style="font-size: 0.9rem; color: var(--text-secondary); margin-bottom: 8px;">
1773
+ Per-dataset:</div>
1774
+ <div style="font-size: 1.1rem;">
1775
+ $$ Acc_d = \frac{C_d}{T_d} $$
1776
+ </div>
1777
+ </div>
1778
+ <div>
1779
+ <div style="font-size: 0.9rem; color: var(--text-secondary); margin-bottom: 8px;">
1780
+ Overall:</div>
1781
+ <div style="font-size: 1.1rem;">
1782
+ $$ Acc_{overall} = \frac{\sum_{d \in D} C_d}{\sum_{d \in D} T_d} $$
1783
+ </div>
1784
+ </div>
1785
+ </div>
1786
+ </div>
1787
+
1788
+ <div style="border-top: 1px solid rgba(255,255,255,0.1); padding-top: 25px;">
1789
+ <h4 style="color: var(--text-secondary); margin-bottom: 15px; font-size: 1rem;">Notation</h4>
1790
+ <table
1791
+ style="width: 100%; color: var(--text-secondary); border-collapse: collapse; font-size: 0.95rem;">
1792
+ <tr style="border-bottom: 1px solid rgba(255,255,255,0.05);">
1793
+ <th style="text-align: left; padding: 8px; color: var(--text);">Symbol</th>
1794
+ <th style="text-align: left; padding: 8px; color: var(--text);">Description</th>
1795
+ </tr>
1796
+ <tr style="border-bottom: 1px solid rgba(255,255,255,0.05);">
1797
+ <td style="padding: 8px;">$$ D $$</td>
1798
+ <td style="padding: 8px;">Set of evaluation datasets</td>
1799
+ </tr>
1800
+ <tr style="border-bottom: 1px solid rgba(255,255,255,0.05);">
1801
+ <td style="padding: 8px;">$$ L_d $$</td>
1802
+ <td style="padding: 8px;">Average cross-entropy loss on dataset \( d \)</td>
1803
+ </tr>
1804
+ <tr style="border-bottom: 1px solid rgba(255,255,255,0.05);">
1805
+ <td style="padding: 8px;">$$ T_d $$</td>
1806
+ <td style="padding: 8px;">Total token count in dataset \( d \)</td>
1807
+ </tr>
1808
+ <tr>
1809
+ <td style="padding: 8px;">$$ C_d $$</td>
1810
+ <td style="padding: 8px;">Correctly predicted tokens in dataset \( d \)</td>
1811
+ </tr>
1812
+ </table>
1813
+ </div>
1814
+ </div>
1815
+ </div>
1816
+ </div>
1817
+ </section>
1818
+
1819
+ <script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
1820
+ <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
1821
+
1822
+ <footer>
1823
+ <div class="container">
1824
+ <div class="logo" style="margin-bottom: 20px; justify-content: center;">Gumini</div>
1825
+ <p style="color: var(--text-secondary); max-width: 500px; margin: 0 auto;"
1826
+ data-en="Pioneering efficient AI research for a more accessible future."
1827
+ data-kr="더 접근하기 쉬운 미래를 위해 효율적인 AI 연구를 개척합니다.">
1828
+ Pioneering efficient AI research for a more accessible future.
1829
+ </p>
1830
+
1831
+ <div class="social-links">
1832
+ <a href="https://huggingface.co/GuminiResearch" class="social-btn" target="_blank" title="Hugging Face">
1833
+ <img src="assets/huggingface.png" class="hf-icon" alt="Hugging Face"
1834
+ style="width: 28px; height: 28px;">
1835
+ </a>
1836
+ <a href="https://github.com/Gumini-Research" class="social-btn" target="_blank" title="GitHub">
1837
+ <i class="fab fa-github"></i>
1838
+ </a>
1839
+ <a href="https://x.com/Gumini_Research" class="social-btn" target="_blank" title="X (Twitter)">
1840
+ <i class="fab fa-x-twitter"></i>
1841
+ </a>
1842
+ <a href="https://www.linkedin.com/in/devgumin" class="social-btn" target="_blank" title="LinkedIn">
1843
+ <i class="fab fa-linkedin-in"></i>
1844
+ </a>
1845
+ </div>
1846
+
1847
+ <p style="color: rgba(255,255,255,0.2); font-size: 0.85rem;">
1848
+ © 2025 Gumini Research. All rights reserved.
1849
+ </p>
1850
+ </div>
1851
+ </footer>
1852
+
1853
+ <script>
1854
+ window.onscroll = function () {
1855
+ let winScroll = document.body.scrollTop || document.documentElement.scrollTop;
1856
+ let height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
1857
+ let scrolled = (winScroll / height) * 100;
1858
+ document.getElementById("scrollProgress").style.width = scrolled + "%";
1859
+
1860
+ const navbar = document.getElementById('navbar');
1861
+ if (window.scrollY > 50) {
1862
+ navbar.classList.add('scrolled');
1863
+ } else {
1864
+ navbar.classList.remove('scrolled');
1865
+ }
1866
+ };
1867
+
1868
+ const observer = new IntersectionObserver((entries) => {
1869
+ entries.forEach(entry => {
1870
+ if (entry.isIntersecting) {
1871
+ entry.target.classList.add('visible');
1872
+ }
1873
+ });
1874
+ }, { threshold: 0.1 });
1875
+
1876
+ document.querySelectorAll('.fade-up').forEach(el => observer.observe(el));
1877
+
1878
+ const counters = document.querySelectorAll('.counter');
1879
+ counters.forEach(counter => {
1880
+ const target = parseInt(counter.dataset.target);
1881
+ const duration = 2000;
1882
+
1883
+ const updateCounter = () => {
1884
+ const count = +counter.innerText;
1885
+ const increment = target / (duration / 16);
1886
+
1887
+ if (count < target) {
1888
+ counter.innerText = Math.ceil(count + increment);
1889
+ requestAnimationFrame(updateCounter);
1890
+ } else {
1891
+ counter.innerText = target;
1892
+ }
1893
+ };
1894
+
1895
+ const counterObserver = new IntersectionObserver((entries) => {
1896
+ if (entries[0].isIntersecting) {
1897
+ updateCounter();
1898
+ counterObserver.disconnect();
1899
+ }
1900
+ });
1901
+ counterObserver.observe(counter);
1902
+ });
1903
+
1904
+ const langBtns = document.querySelectorAll('.lang-btn');
1905
+ const translatables = document.querySelectorAll('[data-en]');
1906
+
1907
+ langBtns.forEach(btn => {
1908
+ btn.addEventListener('click', () => {
1909
+ langBtns.forEach(b => b.classList.remove('active'));
1910
+ btn.classList.add('active');
1911
+
1912
+ const lang = btn.dataset.lang;
1913
+ translatables.forEach(el => {
1914
+ if (lang === 'kr' && el.dataset.kr) {
1915
+ el.innerHTML = el.dataset.kr;
1916
+ } else if (el.dataset.en) {
1917
+ el.innerHTML = el.dataset.en;
1918
+ }
1919
+ });
1920
+ });
1921
+ });
1922
+
1923
+ function copyCode() {
1924
+ const code = document.getElementById('codeSnippet').innerText;
1925
+ navigator.clipboard.writeText(code).then(() => {
1926
+ const btn = document.querySelector('.copy-btn span');
1927
+ const original = btn.textContent;
1928
+ btn.textContent = 'Copied!';
1929
+ setTimeout(() => btn.textContent = original, 2000);
1930
+ });
1931
+ }
1932
+
1933
+ function openModal(src) {
1934
+ const modal = document.getElementById('imageModal');
1935
+ const modalImg = document.getElementById('modalImg');
1936
+ modalImg.src = src;
1937
+ modal.classList.add('active');
1938
+ document.body.style.overflow = 'hidden';
1939
+ }
1940
+ function closeModal() {
1941
+ const modal = document.getElementById('imageModal');
1942
+ modal.classList.remove('active');
1943
+ document.body.style.overflow = 'auto';
1944
+ }
1945
+
1946
+ const commonOptions = {
1947
+ responsive: true,
1948
+ plugins: {
1949
+ legend: { labels: { color: '#a0a0b0', font: { family: 'Outfit' } } }
1950
+ },
1951
+ scales: {
1952
+ y: {
1953
+ grid: { color: 'rgba(255,255,255,0.05)' },
1954
+ ticks: { color: '#a0a0b0', font: { family: 'Outfit' } }
1955
+ },
1956
+ x: {
1957
+ grid: { color: 'rgba(255,255,255,0.05)' },
1958
+ ticks: { color: '#a0a0b0', font: { family: 'Outfit' } }
1959
+ }
1960
+ }
1961
+ };
1962
+
1963
+ new Chart(document.getElementById('pplChart'), {
1964
+ type: 'bar',
1965
+ data: {
1966
+ labels: ['Qwen-2.5-7B', 'Gemma-2B', 'Gumini-1.5B', 'Llama-3.2-3B', 'Polyglot-Ko-1.3B'],
1967
+ datasets: [{
1968
+ label: 'Perplexity (Lower is Better)',
1969
+ data: [6.39, 8.15, 8.49, 9.47, 25.05],
1970
+ backgroundColor: [
1971
+ 'rgba(255, 255, 255, 0.1)',
1972
+ 'rgba(255, 255, 255, 0.1)',
1973
+ '#F72585',
1974
+ 'rgba(255, 255, 255, 0.1)',
1975
+ 'rgba(255, 255, 255, 0.1)'
1976
+ ],
1977
+ borderRadius: 8,
1978
+ borderWidth: 0
1979
+ }]
1980
+ },
1981
+ options: commonOptions
1982
+ });
1983
+
1984
+ new Chart(document.getElementById('scoreChart'), {
1985
+ type: 'line',
1986
+ data: {
1987
+ labels: ['BLOOM-1.1B', 'Polyglot-Ko', 'Llama-3.2-1B', 'Gumini-1B', 'Gumini-1.5B', 'Gemma-2B', 'Qwen-7B'],
1988
+ datasets: [{
1989
+ label: 'Top-1 Accuracy',
1990
+ data: [41.9, 48.6, 49.4, 49.5, 53.6, 54.9, 58.8],
1991
+ borderColor: '#FF8E53',
1992
+ tension: 0.4,
1993
+ pointBackgroundColor: '#FF8E53',
1994
+ pointRadius: 4,
1995
+ pointHoverRadius: 6
1996
+ }]
1997
+ },
1998
+ options: commonOptions
1999
+ });
2000
+ function toggleCitation() {
2001
+ const box = document.getElementById('citationBox');
2002
+ if (box.style.display === 'none') {
2003
+ box.style.display = 'block';
2004
+ } else {
2005
+ box.style.display = 'none';
2006
+ }
2007
+ }
2008
+
2009
+ function copyCitation() {
2010
+ const text = document.querySelector('#citationBox pre').innerText;
2011
+ navigator.clipboard.writeText(text).then(() => {
2012
+ const btn = document.querySelector('#citationBox button i');
2013
+ btn.className = 'fas fa-check';
2014
+ setTimeout(() => {
2015
+ btn.className = 'far fa-copy';
2016
+ }, 2000);
2017
+ });
2018
+ }
2019
+ </script>
2020
+ </body>
2021
+
2022
  </html>