Spaces:

VISHAL18for4
/

forge3d

Sleeping

App Files Files Community

VISHAL18for4 commited on May 12

Commit

20d4dd5

verified ·

1 Parent(s): 2336c29

Upload homepage.html

Browse files

Files changed (1) hide show

static/homepage.html +79 -0

static/homepage.html ADDED Viewed

	@@ -0,0 +1,79 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width,initial-scale=1.0">
+<title>FORGE3D — AI 3D Creation</title>
+<style>
+*{margin:0;padding:0;box-sizing:border-box;}
+body{background:#080808;color:#e0e0e0;font-family:'Segoe UI',sans-serif;overflow-x:hidden;}
+nav{position:fixed;top:0;left:0;right:0;height:52px;background:rgba(8,8,8,.95);border-bottom:1px solid #1a1a1a;display:flex;align-items:center;justify-content:space-between;padding:0 24px;z-index:100;}
+.nlogo{display:flex;align-items:center;gap:8px;text-decoration:none;}
+.nsq{width:28px;height:28px;background:linear-gradient(135deg,#e87d39,#a855f7);border-radius:6px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:13px;color:#fff;}
+.nnm{font-weight:700;font-size:16px;letter-spacing:2px;color:#fff;}
+.nnm span{color:#e87d39;}
+.ncta{padding:8px 20px;background:linear-gradient(135deg,#e87d39,#a855f7);border-radius:8px;color:#fff;text-decoration:none;font-size:13px;font-weight:700;}
+#hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:80px 20px 40px;background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(232,125,57,.08),transparent);}
+h1{font-size:clamp(36px,7vw,80px);font-weight:900;line-height:1.05;letter-spacing:-2px;margin-bottom:20px;background:linear-gradient(135deg,#fff 30%,#e87d39 60%,#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
+.sub{font-size:clamp(15px,2vw,19px);color:#666;max-width:560px;margin:0 auto 40px;line-height:1.8;}
+.sub b{color:#e87d39;font-weight:500;}
+.btn{padding:14px 36px;background:linear-gradient(135deg,#e87d39,#a855f7);border-radius:10px;color:#fff;text-decoration:none;font-size:15px;font-weight:700;display:inline-block;margin:6px;}
+.btn2{padding:14px 36px;border:1px solid #2a2a2a;border-radius:10px;color:#aaa;text-decoration:none;font-size:15px;display:inline-block;margin:6px;}
+.btn2:hover{background:#141414;color:#fff;}
+.sec{padding:80px 20px;max-width:1100px;margin:0 auto;}
+.stag{color:#e87d39;font-size:11px;letter-spacing:3px;font-weight:700;text-transform:uppercase;margin-bottom:10px;text-align:center;}
+.stitle{font-size:clamp(24px,3.5vw,40px);font-weight:900;text-align:center;margin-bottom:12px;color:#fff;}
+.ssub{color:#555;font-size:14px;text-align:center;max-width:440px;margin:0 auto 60px;line-height:1.7;}
+.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;background:#111;}
+.card{background:#0d0d0d;padding:30px;transition:background .2s;}
+.card:hover{background:#111;}
+.cico{font-size:24px;margin-bottom:14px;}
+.ctitle{font-size:16px;font-weight:700;color:#fff;margin-bottom:8px;}
+.cdesc{color:#555;font-size:13px;line-height:1.7;}
+.models{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
+@media(max-width:700px){.models{grid-template-columns:1fr;}}
+.mcard{background:#0d0d0d;border:1px solid #1a1a1a;border-radius:12px;padding:24px;position:relative;}
+.mcard::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;border-radius:12px 12px 0 0;}
+.mcard.m1::before{background:linear-gradient(90deg,#ff6b35,#ff9955);}
+.mcard.m2::before{background:linear-gradient(90deg,#76b900,#a3e635);}
+.mcard.m3::before{background:linear-gradient(90deg,#a855f7,#7c3aed);}
+.mname{font-size:17px;font-weight:700;color:#fff;margin-bottom:4px;}
+.mlbl{font-size:10px;color:#444;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px;}
+.mdesc{color:#555;font-size:13px;line-height:1.6;}
+footer{border-top:1px solid #111;padding:24px;text-align:center;color:#333;font-size:12px;}
+</style>
+</head>
+<body>
+<nav>
+  <a class="nlogo" href="/"><div class="nsq">F</div><div class="nnm">FORGE<span>3D</span></div></a>
+  <a class="ncta" href="/editor">Launch Editor →</a>
+</nav>
+<section id="hero">
+  <h1>Build 3D Worlds<br>With AI</h1>
+  <p class="sub">Describe anything — <b>missiles, black holes, solar systems</b> — and watch AI build it in seconds. Sculpt, animate, texture, render. All in your browser.</p>
+  <div><a class="btn" href="/editor">🚀 Launch Editor</a><a class="btn2" href="#features">How It Works ↓</a></div>
+</section>
+<div id="features">
+<div class="sec">
+  <div class="stag">Features</div><div class="stitle">Everything You Need</div><p class="ssub">Pro 3D tools + triple AI engine.</p>
+  <div class="grid">
+    <div class="card"><div class="cico">🤖</div><div class="ctitle">Triple AI Engine</div><div class="cdesc">Groq (fast), Nemotron (scenes), Detail AI (complex). Each pre-loaded with Three.js expertise and detailed model recipes.</div></div>
+    <div class="card"><div class="cico">🚀</div><div class="ctitle">Complex Models</div><div class="cdesc">Missiles with 15+ parts, black holes with glowing accretion disks and jets, animated solar systems with real orbital physics.</div></div>
+    <div class="card"><div class="cico">✏️</div><div class="ctitle">Sculpt Mode</div><div class="cdesc">6 sculpt brushes: Draw, Smooth, Grab, Inflate, Flatten, Crease. Subdivide meshes for higher resolution sculpting.</div></div>
+    <div class="card"><div class="cico">🎬</div><div class="ctitle">AI Animation</div><div class="cdesc">Describe motion and AI writes requestAnimationFrame loops. Real orbital motion, not static placement.</div></div>
+    <div class="card"><div class="cico">📝</div><div class="ctitle">Script Tab</div><div class="cdesc">Full JS editor always visible. AI code saves here automatically. Run, edit, template-insert anytime.</div></div>
+    <div class="card"><div class="cico">🧠</div><div class="ctitle">SKILLS.md</div><div class="cdesc">Upload SKILLS.md to HuggingFace. AI reads it before every request. Teach it your style and custom helpers.</div></div>
+  </div>
+</div>
+<div class="sec">
+  <div class="stag">AI Models</div><div class="stitle">Three Specialists</div><p class="ssub">Switch based on complexity.</p>
+  <div class="models">
+    <div class="mcard m1"><div class="mname">⚡ Groq</div><div class="mlbl">Llama-3.3-70B · Fast</div><div class="mdesc">Quick commands, single objects, material changes. Responds in ~1 second. Also the fallback when others fail.</div></div>
+    <div class="mcard m2"><div class="mname">🟢 Nemotron</div><div class="mlbl">NVIDIA · Scene Designer</div><div class="mdesc">Full environments 15-40 objects. Animated solar systems with requestAnimationFrame. Atmospheric colored lighting.</div></div>
+    <div class="mcard m3"><div class="mname">🔮 Detail AI</div><div class="mlbl">OpenRouter · Complex</div><div class="mdesc">15-50 part models. Missiles, black holes, spaceships. Uses LatheGeometry, ExtrudeGeometry, TubeGeometry. Falls back to Groq if OpenRouter rate-limits.</div></div>
+  </div>
+</div>
+</div>
+<footer>FORGE3D v4.0 — Three.js + Groq + NVIDIA + OpenRouter — Hosted on HuggingFace</footer>
+</body>
+</html>