Hugging Face's logo

Spaces:
UncensoredAI123
/
scidraw
Running

App Files Community
UncensoredAI123 commited on
Commit
ca0eb06
·
verified ·
1 Parent(s): 718a132

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +325 -19
index.html CHANGED
@@ -1,19 +1,325 @@
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
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>SciDraw - AI Scientific Illustration Generator</title>
7
+ <meta name="description" content="Create publication-ready scientific figures in seconds with AI. TOC graphics, journal covers, pathway diagrams for researchers.">
8
+ <style>
9
+ * {
10
+ margin: 0;
11
+ padding: 0;
12
+ box-sizing: border-box;
13
+ }
14
+
15
+ body {
16
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
17
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
18
+ min-height: 100vh;
19
+ color: #333;
20
+ }
21
+
22
+ .container {
23
+ max-width: 900px;
24
+ margin: 0 auto;
25
+ padding: 40px 20px;
26
+ }
27
+
28
+ .hero {
29
+ background: white;
30
+ border-radius: 20px;
31
+ padding: 50px 40px;
32
+ text-align: center;
33
+ box-shadow: 0 20px 60px rgba(0,0,0,0.15);
34
+ margin-bottom: 30px;
35
+ }
36
+
37
+ .logo {
38
+ font-size: 3rem;
39
+ margin-bottom: 10px;
40
+ }
41
+
42
+ h1 {
43
+ font-size: 2.5rem;
44
+ color: #1a1a2e;
45
+ margin-bottom: 15px;
46
+ }
47
+
48
+ .tagline {
49
+ font-size: 1.3rem;
50
+ color: #666;
51
+ margin-bottom: 30px;
52
+ }
53
+
54
+ .cta-button {
55
+ display: inline-block;
56
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
57
+ color: white;
58
+ padding: 18px 50px;
59
+ border-radius: 50px;
60
+ text-decoration: none;
61
+ font-size: 1.2rem;
62
+ font-weight: 600;
63
+ transition: transform 0.3s, box-shadow 0.3s;
64
+ }
65
+
66
+ .cta-button:hover {
67
+ transform: translateY(-3px);
68
+ box-shadow: 0 10px 30px rgba(102, 126, 234, 0.4);
69
+ }
70
+
71
+ .stats {
72
+ display: flex;
73
+ justify-content: center;
74
+ gap: 40px;
75
+ margin-top: 40px;
76
+ flex-wrap: wrap;
77
+ }
78
+
79
+ .stat {
80
+ text-align: center;
81
+ }
82
+
83
+ .stat-number {
84
+ font-size: 2rem;
85
+ font-weight: 700;
86
+ color: #667eea;
87
+ }
88
+
89
+ .stat-label {
90
+ color: #888;
91
+ font-size: 0.9rem;
92
+ }
93
+
94
+ .features {
95
+ background: white;
96
+ border-radius: 20px;
97
+ padding: 40px;
98
+ box-shadow: 0 20px 60px rgba(0,0,0,0.15);
99
+ margin-bottom: 30px;
100
+ }
101
+
102
+ .features h2 {
103
+ text-align: center;
104
+ margin-bottom: 30px;
105
+ color: #1a1a2e;
106
+ }
107
+
108
+ .feature-grid {
109
+ display: grid;
110
+ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
111
+ gap: 25px;
112
+ }
113
+
114
+ .feature-card {
115
+ background: #f8f9ff;
116
+ padding: 25px;
117
+ border-radius: 15px;
118
+ border-left: 4px solid #667eea;
119
+ }
120
+
121
+ .feature-card h3 {
122
+ color: #1a1a2e;
123
+ margin-bottom: 10px;
124
+ font-size: 1.1rem;
125
+ }
126
+
127
+ .feature-card p {
128
+ color: #666;
129
+ font-size: 0.95rem;
130
+ line-height: 1.5;
131
+ }
132
+
133
+ .use-cases {
134
+ background: white;
135
+ border-radius: 20px;
136
+ padding: 40px;
137
+ box-shadow: 0 20px 60px rgba(0,0,0,0.15);
138
+ margin-bottom: 30px;
139
+ }
140
+
141
+ .use-cases h2 {
142
+ text-align: center;
143
+ margin-bottom: 25px;
144
+ color: #1a1a2e;
145
+ }
146
+
147
+ .tags {
148
+ display: flex;
149
+ flex-wrap: wrap;
150
+ justify-content: center;
151
+ gap: 12px;
152
+ }
153
+
154
+ .tag {
155
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
156
+ color: white;
157
+ padding: 10px 20px;
158
+ border-radius: 25px;
159
+ font-size: 0.9rem;
160
+ }
161
+
162
+ .free-tier {
163
+ background: #1a1a2e;
164
+ border-radius: 20px;
165
+ padding: 40px;
166
+ text-align: center;
167
+ color: white;
168
+ box-shadow: 0 20px 60px rgba(0,0,0,0.15);
169
+ }
170
+
171
+ .free-tier h2 {
172
+ margin-bottom: 25px;
173
+ }
174
+
175
+ .free-list {
176
+ list-style: none;
177
+ margin-bottom: 30px;
178
+ }
179
+
180
+ .free-list li {
181
+ padding: 10px 0;
182
+ font-size: 1.1rem;
183
+ }
184
+
185
+ .free-list li::before {
186
+ content: "✓ ";
187
+ color: #4ade80;
188
+ font-weight: bold;
189
+ }
190
+
191
+ .cta-button-light {
192
+ display: inline-block;
193
+ background: white;
194
+ color: #667eea;
195
+ padding: 18px 50px;
196
+ border-radius: 50px;
197
+ text-decoration: none;
198
+ font-size: 1.2rem;
199
+ font-weight: 600;
200
+ transition: transform 0.3s;
201
+ }
202
+
203
+ .cta-button-light:hover {
204
+ transform: translateY(-3px);
205
+ }
206
+
207
+ footer {
208
+ text-align: center;
209
+ padding: 30px;
210
+ color: rgba(255,255,255,0.8);
211
+ }
212
+
213
+ footer a {
214
+ color: white;
215
+ }
216
+
217
+ @media (max-width: 600px) {
218
+ h1 { font-size: 1.8rem; }
219
+ .tagline { font-size: 1.1rem; }
220
+ .hero { padding: 30px 20px; }
221
+ .stats { gap: 20px; }
222
+ }
223
+ </style>
224
+ </head>
225
+ <body>
226
+ <div class="container">
227
+ <div class="hero">
228
+ <div class="logo">🎨</div>
229
+ <h1>SciDraw</h1>
230
+ <p class="tagline">AI Scientific Illustration Generator for Researchers</p>
231
+ <p style="color: #888; margin-bottom: 30px;">
232
+ Create publication-ready TOC graphics, journal covers & research figures in seconds.
233
+ </p>
234
+ <a href="https://sci-draw.com" class="cta-button" target="_blank">
235
+ Try Free →
236
+ </a>
237
+
238
+ <div class="stats">
239
+ <div class="stat">
240
+ <div class="stat-number">10,000+</div>
241
+ <div class="stat-label">Researchers</div>
242
+ </div>
243
+ <div class="stat">
244
+ <div class="stat-number">90%</div>
245
+ <div class="stat-label">Time Saved</div>
246
+ </div>
247
+ <div class="stat">
248
+ <div class="stat-number">95%</div>
249
+ <div class="stat-label">Cost Reduction</div>
250
+ </div>
251
+ </div>
252
+ </div>
253
+
254
+ <div class="features">
255
+ <h2>✨ Key Features</h2>
256
+ <div class="feature-grid">
257
+ <div class="feature-card">
258
+ <h3>🖼️ Text-to-Image</h3>
259
+ <p>Describe your scientific concept in words, AI generates professional illustrations automatically.</p>
260
+ </div>
261
+ <div class="feature-card">
262
+ <h3>✏️ Sketch-to-Image</h3>
263
+ <p>Upload rough drawings, AI transforms them into polished, publication-ready figures.</p>
264
+ </div>
265
+ <div class="feature-card">
266
+ <h3>🔄 Multi-round Editing</h3>
267
+ <p>Refine through conversation. "Make it larger", "Change color" — keep iterating until perfect.</p>
268
+ </div>
269
+ <div class="feature-card">
270
+ <h3>📐 SVG Vector Export</h3>
271
+ <p>Edit text, colors, and shapes in Adobe Illustrator, Inkscape, or PowerPoint.</p>
272
+ </div>
273
+ <div class="feature-card">
274
+ <h3>🎨 7+ Templates</h3>
275
+ <p>TOC graphics, journal covers, pathways, mechanisms — all common research scenarios covered.</p>
276
+ </div>
277
+ <div class="feature-card">
278
+ <h3>🌈 6+ Visual Styles</h3>
279
+ <p>Flat illustration, 3D rendering, photorealistic, schematic — match any journal's requirements.</p>
280
+ </div>
281
+ </div>
282
+ </div>
283
+
284
+ <div class="use-cases">
285
+ <h2>🔬 Perfect For</h2>
286
+ <div class="tags">
287
+ <span class="tag">TOC Graphics</span>
288
+ <span class="tag">Graphical Abstracts</span>
289
+ <span class="tag">Journal Covers</span>
290
+ <span class="tag">Pathway Diagrams</span>
291
+ <span class="tag">Molecular Structures</span>
292
+ <span class="tag">Cell Signaling</span>
293
+ <span class="tag">Mechanism Illustrations</span>
294
+ <span class="tag">Experimental Workflows</span>
295
+ <span class="tag">Grant Proposals</span>
296
+ <span class="tag">Thesis Figures</span>
297
+ </div>
298
+ </div>
299
+
300
+ <div class="free-tier">
301
+ <h2>🆓 Start Free Today</h2>
302
+ <ul class="free-list">
303
+ <li>10 free credits on signup</li>
304
+ <li>5 free credits every day</li>
305
+ <li>No credit card required</li>
306
+ <li>All features included</li>
307
+ </ul>
308
+ <a href="https://sci-draw.com/ai-drawing" class="cta-button-light" target="_blank">
309
+ Start Creating →
310
+ </a>
311
+ </div>
312
+
313
+ <footer>
314
+ <p>
315
+ <a href="https://sci-draw.com" target="_blank">Website</a> ·
316
+ <a href="https://sci-draw.com/blog" target="_blank">Blog</a> ·
317
+ <a href="mailto:support@sci-draw.com">Contact</a>
318
+ </p>
319
+ <p style="margin-top: 15px; font-size: 0.9rem;">
320
+ Trusted by researchers at Stanford, MIT, Harvard, Oxford, ETH Zurich
321
+ </p>
322
+ </footer>
323
+ </div>
324
+ </body>
325
+ </html>