liyangbing commited on
Commit
e05aadd
Β·
1 Parent(s): 556171f
Files changed (2) hide show
  1. index.html +60 -15
  2. style.css +154 -27
index.html CHANGED
@@ -4,32 +4,32 @@
4
  <meta charset="utf-8" />
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
  <title>Wan 2.2 - Advanced Video Generation by Alibaba Tongyi Lab</title>
7
- <meta name="description" content="Wan 2.2: Advanced Large-Scale Video Generative Models by Alibaba Tongyi Lab. Experience state-of-the-art video generation capabilities." />
8
- <meta name="keywords" content="Wan 2.2, Alibaba, Tongyi Lab, Video Generation, AI Models, Text-to-Video, Image-to-Video, WaveSpeedAI" />
9
 
10
  <!-- Open Graph / Social Media Meta Tags -->
11
  <meta property="og:title" content="Wan 2.2 - Advanced Video Generation by Alibaba Tongyi Lab" />
12
  <meta property="og:description" content="Experience the next generation of video AI with Wan 2.2, developed by Alibaba Tongyi Lab" />
13
  <meta property="og:type" content="website" />
14
- <meta property="og:url" content="https://wavespeed.ai" />
15
 
16
  <!-- Additional Meta Information -->
17
  <meta name="author" content="Alibaba Tongyi Lab" />
18
  <meta name="robots" content="index, follow" />
19
- <link rel="canonical" href="https://wavespeed.ai" />
20
 
21
  <link rel="stylesheet" href="style.css" />
22
- <meta http-equiv="refresh" content="5;url=https://wavespeed.ai" />
23
  </head>
24
  <body>
25
  <nav class="top-nav">
26
  <div class="nav-content">
27
  <div class="nav-logo">WAN</div>
28
  <div class="nav-links">
29
- <a href="https://wavespeed.ai" class="nav-link" target="_blank" rel="noopener noreferrer">Home</a>
30
  <a href="https://wavespeed.ai/docs" class="nav-link" target="_blank" rel="noopener noreferrer">Documentation</a>
31
  <a href="https://wavespeed.ai/blog" class="nav-link" target="_blank" rel="noopener noreferrer">Blog</a>
32
- <a href="https://wavespeed.ai" class="nav-button" target="_blank" rel="noopener noreferrer">Visit WaveSpeedAI β†’</a>
33
  </div>
34
  </div>
35
  </nav>
@@ -44,21 +44,66 @@
44
  <div class="announcement-section">
45
  <p class="announcement">Wan 2.2 is now available on WaveSpeedAI!</p>
46
  <div class="divider"></div>
47
- <p class="description">Advanced Large-Scale Video Generative Models</p>
48
  </div>
49
 
50
  <div class="features-section">
51
  <div class="feature">
52
- <h3>πŸš€ Enhanced Performance</h3>
53
- <p>Experience lightning-fast speed and improved efficiency in video generation</p>
54
  </div>
55
  <div class="feature">
56
- <h3>🎯 New Features</h3>
57
- <p>Discover the latest innovations in AI video generation by Tongyi Lab</p>
58
  </div>
59
  <div class="feature">
60
- <h3>🌟 Better Experience</h3>
61
- <p>Enjoy a more intuitive and seamless interface powered by Alibaba Cloud</p>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
62
  </div>
63
  </div>
64
 
@@ -67,7 +112,7 @@
67
  <div class="progress-bar">
68
  <div class="progress"></div>
69
  </div>
70
- <a href="https://wavespeed.ai" class="cta-button" target="_blank" rel="noopener noreferrer">Visit Now β†’</a>
71
  <p class="huggingface-link">
72
  Also available on <a href="https://huggingface.co/Wan-AI" target="_blank" rel="noopener noreferrer">Hugging Face</a>
73
  </p>
 
4
  <meta charset="utf-8" />
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
  <title>Wan 2.2 - Advanced Video Generation by Alibaba Tongyi Lab</title>
7
+ <meta name="description" content="Wan 2.2: Open and Advanced Large-Scale Video Generative Models by Alibaba Tongyi Lab. Featuring MoE architecture, cinematic-level aesthetics, and complex motion generation." />
8
+ <meta name="keywords" content="Wan 2.2, Alibaba, Tongyi Lab, Video Generation, AI Models, Text-to-Video, Image-to-Video, WaveSpeedAI, MoE, Video AI" />
9
 
10
  <!-- Open Graph / Social Media Meta Tags -->
11
  <meta property="og:title" content="Wan 2.2 - Advanced Video Generation by Alibaba Tongyi Lab" />
12
  <meta property="og:description" content="Experience the next generation of video AI with Wan 2.2, developed by Alibaba Tongyi Lab" />
13
  <meta property="og:type" content="website" />
14
+ <meta property="og:url" content="https://wavespeed.ai/collections/wan-2-2" />
15
 
16
  <!-- Additional Meta Information -->
17
  <meta name="author" content="Alibaba Tongyi Lab" />
18
  <meta name="robots" content="index, follow" />
19
+ <link rel="canonical" href="https://wavespeed.ai/collections/wan-2-2" />
20
 
21
  <link rel="stylesheet" href="style.css" />
22
+ <meta http-equiv="refresh" content="5;url=https://wavespeed.ai/collections/wan-2-2" />
23
  </head>
24
  <body>
25
  <nav class="top-nav">
26
  <div class="nav-content">
27
  <div class="nav-logo">WAN</div>
28
  <div class="nav-links">
29
+ <a href="https://wavespeed.ai/collections/wan-2-2" class="nav-link" target="_blank" rel="noopener noreferrer">Home</a>
30
  <a href="https://wavespeed.ai/docs" class="nav-link" target="_blank" rel="noopener noreferrer">Documentation</a>
31
  <a href="https://wavespeed.ai/blog" class="nav-link" target="_blank" rel="noopener noreferrer">Blog</a>
32
+ <a href="https://wavespeed.ai/collections/wan-2-2" class="nav-button" target="_blank" rel="noopener noreferrer">Visit WaveSpeedAI β†’</a>
33
  </div>
34
  </div>
35
  </nav>
 
44
  <div class="announcement-section">
45
  <p class="announcement">Wan 2.2 is now available on WaveSpeedAI!</p>
46
  <div class="divider"></div>
47
+ <p class="description">Open and Advanced Large-Scale Video Generative Models</p>
48
  </div>
49
 
50
  <div class="features-section">
51
  <div class="feature">
52
+ <h3>πŸš€ Effective MoE Architecture</h3>
53
+ <p>Advanced Mixture-of-Experts architecture separates denoising process with specialized expert models, enlarging model capacity while maintaining computational cost</p>
54
  </div>
55
  <div class="feature">
56
+ <h3>🎯 Cinematic-level Aesthetics</h3>
57
+ <p>Meticulously curated aesthetic data with detailed labels for lighting, composition, contrast, and color tone for precise and controllable cinematic style generation</p>
58
  </div>
59
  <div class="feature">
60
+ <h3>🌟 Complex Motion Generation</h3>
61
+ <p>Trained on +65.6% more images and +83.2% more videos, achieving superior performance in motions, semantics, and aesthetics</p>
62
+ </div>
63
+ </div>
64
+
65
+ <div class="models-section">
66
+ <h3 class="models-title">Model Downloads</h3>
67
+ <div class="models-grid">
68
+ <div class="model-category">
69
+ <h4>Text to Video Models</h4>
70
+ <div class="model-links">
71
+ <a href="https://huggingface.co/Wan-AI/Wan2.2-T2V-A14B" target="_blank" rel="noopener noreferrer" class="model-link">
72
+ <span class="model-name">T2V-A14B</span>
73
+ <span class="model-tag">Base</span>
74
+ </a>
75
+ <a href="https://huggingface.co/Wan-AI/Wan2.2-T2V-A14B-Diffusers" target="_blank" rel="noopener noreferrer" class="model-link">
76
+ <span class="model-name">T2V-A14B</span>
77
+ <span class="model-tag">Diffusers</span>
78
+ </a>
79
+ </div>
80
+ </div>
81
+ <div class="model-category">
82
+ <h4>Image to Video Models</h4>
83
+ <div class="model-links">
84
+ <a href="https://huggingface.co/Wan-AI/Wan2.2-I2V-A14B" target="_blank" rel="noopener noreferrer" class="model-link">
85
+ <span class="model-name">I2V-A14B</span>
86
+ <span class="model-tag">Base</span>
87
+ </a>
88
+ <a href="https://huggingface.co/Wan-AI/Wan2.2-I2V-A14B-Diffusers" target="_blank" rel="noopener noreferrer" class="model-link">
89
+ <span class="model-name">I2V-A14B</span>
90
+ <span class="model-tag">Diffusers</span>
91
+ </a>
92
+ </div>
93
+ </div>
94
+ </div>
95
+
96
+ <div class="model-highlight">
97
+ <h4>Efficient High-Definition Hybrid TI2V</h4>
98
+ <p>5B model with advanced Wan2.2-VAE achieving 16Γ—16Γ—4 compression ratio. Supports both text-to-video and image-to-video generation at 720P resolution with 24fps.</p>
99
+ <div class="highlight-links">
100
+ <a href="https://huggingface.co/Wan-AI/Wan2.2-TI2V-5B" target="_blank" rel="noopener noreferrer" class="highlight-link">
101
+ <span>TI2V-5B Base</span>
102
+ </a>
103
+ <a href="https://huggingface.co/Wan-AI/Wan2.2-TI2V-5B-Diffusers" target="_blank" rel="noopener noreferrer" class="highlight-link">
104
+ <span>TI2V-5B Diffusers</span>
105
+ </a>
106
+ </div>
107
  </div>
108
  </div>
109
 
 
112
  <div class="progress-bar">
113
  <div class="progress"></div>
114
  </div>
115
+ <a href="https://wavespeed.ai/collections/wan-2-2" class="cta-button" target="_blank" rel="noopener noreferrer">Visit Now β†’</a>
116
  <p class="huggingface-link">
117
  Also available on <a href="https://huggingface.co/Wan-AI" target="_blank" rel="noopener noreferrer">Hugging Face</a>
118
  </p>
style.css CHANGED
@@ -45,7 +45,7 @@
45
  }
46
 
47
  .nav-button {
48
- background: #4CAF50;
49
  color: white;
50
  padding: 0.5rem 1.2rem;
51
  border-radius: 20px;
@@ -56,11 +56,11 @@
56
  }
57
 
58
  .nav-button:hover {
59
- background: #45a049;
60
  transform: translateY(-1px);
61
  }
62
 
63
- /* Existing Styles */
64
  body {
65
  margin: 0;
66
  padding: 0;
@@ -78,7 +78,7 @@ body {
78
  padding: 2rem;
79
  max-width: 800px;
80
  width: 100%;
81
- margin-top: 4rem; /* Add space for fixed navigation */
82
  }
83
 
84
  .content {
@@ -105,10 +105,10 @@ h1, h2 {
105
 
106
  .announcement {
107
  font-size: 2rem;
108
- color: #4CAF50;
109
  margin: 1rem 0;
110
  font-weight: bold;
111
- text-shadow: 0 0 10px rgba(76,175,80,0.3);
112
  }
113
 
114
  .divider {
@@ -150,6 +150,95 @@ h1, h2 {
150
  margin: 0;
151
  }
152
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
153
  .redirect-section {
154
  margin-top: 3rem;
155
  }
@@ -172,14 +261,14 @@ h1, h2 {
172
 
173
  .progress {
174
  height: 100%;
175
- background: #4CAF50;
176
  animation: progress 5s linear;
177
  }
178
 
179
  .cta-button {
180
  display: inline-block;
181
  padding: 0.8rem 1.5rem;
182
- background: #4CAF50;
183
  color: white;
184
  text-decoration: none;
185
  border-radius: 25px;
@@ -189,24 +278,10 @@ h1, h2 {
189
  }
190
 
191
  .cta-button:hover {
192
- background: #45a049;
193
  transform: scale(1.05);
194
  }
195
 
196
- .subtitle {
197
- color: #aaa;
198
- font-size: 1.2rem;
199
- margin-top: 0.5rem;
200
- font-weight: 500;
201
- }
202
-
203
- .description {
204
- color: #888;
205
- font-size: 1.2rem;
206
- margin: 1rem 0;
207
- font-weight: 500;
208
- }
209
-
210
  .huggingface-link {
211
  margin-top: 2rem;
212
  font-size: 0.9rem;
@@ -214,16 +289,41 @@ h1, h2 {
214
  }
215
 
216
  .huggingface-link a {
217
- color: #4CAF50;
218
  text-decoration: none;
219
  transition: color 0.3s ease;
220
  }
221
 
222
  .huggingface-link a:hover {
223
- color: #45a049;
224
  text-decoration: underline;
225
  }
226
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
227
  @keyframes fadeIn {
228
  from { opacity: 0; transform: translateY(-20px); }
229
  to { opacity: 1; transform: translateY(0); }
@@ -250,11 +350,11 @@ h1, h2 {
250
  }
251
 
252
  .nav-link {
253
- display: none; /* Hide less important links on mobile */
254
  }
255
 
256
  .nav-button {
257
- display: block; /* Keep the login button visible */
258
  }
259
  }
260
 
@@ -275,4 +375,31 @@ h1, h2 {
275
  .container {
276
  padding: 1rem;
277
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
278
  }
 
45
  }
46
 
47
  .nav-button {
48
+ background: #2196F3;
49
  color: white;
50
  padding: 0.5rem 1.2rem;
51
  border-radius: 20px;
 
56
  }
57
 
58
  .nav-button:hover {
59
+ background: #1976D2;
60
  transform: translateY(-1px);
61
  }
62
 
63
+ /* Content Styles */
64
  body {
65
  margin: 0;
66
  padding: 0;
 
78
  padding: 2rem;
79
  max-width: 800px;
80
  width: 100%;
81
+ margin-top: 4rem;
82
  }
83
 
84
  .content {
 
105
 
106
  .announcement {
107
  font-size: 2rem;
108
+ color: #2196F3;
109
  margin: 1rem 0;
110
  font-weight: bold;
111
+ text-shadow: 0 0 10px rgba(33,150,243,0.3);
112
  }
113
 
114
  .divider {
 
150
  margin: 0;
151
  }
152
 
153
+ .models-section {
154
+ margin: 3rem 0;
155
+ padding: 2rem;
156
+ background: rgba(255,255,255,0.03);
157
+ border-radius: 16px;
158
+ }
159
+
160
+ .models-title {
161
+ font-size: 1.5rem;
162
+ color: #fff;
163
+ margin-bottom: 2rem;
164
+ text-align: center;
165
+ }
166
+
167
+ .models-grid {
168
+ display: grid;
169
+ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
170
+ gap: 2rem;
171
+ }
172
+
173
+ .model-category {
174
+ text-align: left;
175
+ }
176
+
177
+ .model-category h4 {
178
+ color: #aaa;
179
+ font-size: 1.1rem;
180
+ margin-bottom: 1rem;
181
+ padding-bottom: 0.5rem;
182
+ border-bottom: 1px solid rgba(255,255,255,0.1);
183
+ }
184
+
185
+ .model-links {
186
+ display: flex;
187
+ flex-direction: column;
188
+ gap: 1rem;
189
+ }
190
+
191
+ .model-link {
192
+ display: flex;
193
+ justify-content: space-between;
194
+ align-items: center;
195
+ padding: 1rem;
196
+ background: rgba(255,255,255,0.05);
197
+ border-radius: 8px;
198
+ text-decoration: none;
199
+ transition: all 0.3s ease;
200
+ }
201
+
202
+ .model-link:hover {
203
+ background: rgba(255,255,255,0.1);
204
+ transform: translateY(-2px);
205
+ }
206
+
207
+ .model-name {
208
+ color: #fff;
209
+ font-weight: 500;
210
+ }
211
+
212
+ .model-tag {
213
+ font-size: 0.8rem;
214
+ padding: 0.2rem 0.6rem;
215
+ background: #2196F3;
216
+ color: white;
217
+ border-radius: 12px;
218
+ font-weight: 500;
219
+ }
220
+
221
+ .model-highlight {
222
+ margin-top: 2rem;
223
+ padding: 1.5rem;
224
+ background: linear-gradient(135deg, rgba(33,150,243,0.1), rgba(33,150,243,0.05));
225
+ border-radius: 12px;
226
+ border: 1px solid rgba(33,150,243,0.2);
227
+ }
228
+
229
+ .model-highlight h4 {
230
+ color: #2196F3;
231
+ font-size: 1.2rem;
232
+ margin: 0 0 1rem 0;
233
+ }
234
+
235
+ .model-highlight p {
236
+ color: #aaa;
237
+ font-size: 0.95rem;
238
+ line-height: 1.6;
239
+ margin: 0;
240
+ }
241
+
242
  .redirect-section {
243
  margin-top: 3rem;
244
  }
 
261
 
262
  .progress {
263
  height: 100%;
264
+ background: #2196F3;
265
  animation: progress 5s linear;
266
  }
267
 
268
  .cta-button {
269
  display: inline-block;
270
  padding: 0.8rem 1.5rem;
271
+ background: #2196F3;
272
  color: white;
273
  text-decoration: none;
274
  border-radius: 25px;
 
278
  }
279
 
280
  .cta-button:hover {
281
+ background: #1976D2;
282
  transform: scale(1.05);
283
  }
284
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
285
  .huggingface-link {
286
  margin-top: 2rem;
287
  font-size: 0.9rem;
 
289
  }
290
 
291
  .huggingface-link a {
292
+ color: #2196F3;
293
  text-decoration: none;
294
  transition: color 0.3s ease;
295
  }
296
 
297
  .huggingface-link a:hover {
298
+ color: #1976D2;
299
  text-decoration: underline;
300
  }
301
 
302
+ .highlight-links {
303
+ display: flex;
304
+ gap: 1rem;
305
+ margin-top: 1.5rem;
306
+ justify-content: center;
307
+ }
308
+
309
+ .highlight-link {
310
+ display: inline-block;
311
+ padding: 0.6rem 1.2rem;
312
+ background: rgba(33,150,243,0.1);
313
+ border: 1px solid rgba(33,150,243,0.3);
314
+ border-radius: 8px;
315
+ color: #2196F3;
316
+ text-decoration: none;
317
+ font-size: 0.9rem;
318
+ font-weight: 500;
319
+ transition: all 0.3s ease;
320
+ }
321
+
322
+ .highlight-link:hover {
323
+ background: rgba(33,150,243,0.2);
324
+ transform: translateY(-2px);
325
+ }
326
+
327
  @keyframes fadeIn {
328
  from { opacity: 0; transform: translateY(-20px); }
329
  to { opacity: 1; transform: translateY(0); }
 
350
  }
351
 
352
  .nav-link {
353
+ display: none;
354
  }
355
 
356
  .nav-button {
357
+ display: block;
358
  }
359
  }
360
 
 
375
  .container {
376
  padding: 1rem;
377
  }
378
+
379
+ .models-section {
380
+ padding: 1rem;
381
+ }
382
+
383
+ .models-grid {
384
+ grid-template-columns: 1fr;
385
+ gap: 1rem;
386
+ }
387
+
388
+ .model-link {
389
+ padding: 0.8rem;
390
+ }
391
+
392
+ .model-highlight {
393
+ margin-top: 1.5rem;
394
+ padding: 1rem;
395
+ }
396
+
397
+ .highlight-links {
398
+ flex-direction: column;
399
+ gap: 0.8rem;
400
+ }
401
+
402
+ .highlight-link {
403
+ text-align: center;
404
+ }
405
  }