Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"/> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"/> | |
| <title>NutriVision — AI Food Intelligence</title> | |
| <link rel="preconnect" href="https://fonts.googleapis.com"/> | |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin/> | |
| <link href="https://fonts.googleapis.com/css2?family=Syne:wght@400;500;700;800&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;1,9..40,400&display=swap" rel="stylesheet"/> | |
| <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}"/> | |
| </head> | |
| <body> | |
| <!-- NAV --> | |
| <nav class="nav" id="navbar"> | |
| <div class="nav__inner"> | |
| <a href="/" class="nav__logo"> | |
| <span class="logo-icon">🥗</span> | |
| <span class="logo-text">NutriVision</span> | |
| </a> | |
| <ul class="nav__links"> | |
| <li><a href="/" class="nav__link nav__link--active">Home</a></li> | |
| <li><a href="/analyzer" class="nav__link">Analyzer</a></li> | |
| <li><a href="/about" class="nav__link">About</a></li> | |
| </ul> | |
| <a href="/analyzer" class="nav__cta btn btn--sm">Analyze Food →</a> | |
| <button class="hamburger" id="hamburger"> | |
| <span></span><span></span><span></span> | |
| </button> | |
| </div> | |
| </nav> | |
| <div class="mobile-menu" id="mobileMenu"> | |
| <a href="/" class="mobile-link">Home</a> | |
| <a href="/analyzer" class="mobile-link">Analyzer</a> | |
| <a href="/about" class="mobile-link">About</a> | |
| <a href="/analyzer" class="mobile-link highlight">🍽️ Analyze Now</a> | |
| </div> | |
| <!-- HERO --> | |
| <section class="hero"> | |
| <div class="hero__bg"> | |
| <div class="orb orb--a"></div> | |
| <div class="orb orb--b"></div> | |
| <div class="orb orb--c"></div> | |
| <div class="grid-bg"></div> | |
| </div> | |
| <div class="hero__body container"> | |
| <div class="hero__left"> | |
| <div class="hero__badge reveal"> | |
| <span class="pulse-dot"></span> 3 Vision Models · OpenRouter LLM | |
| </div> | |
| <h1 class="hero__title reveal d1"> | |
| Snap a Photo.<br/> | |
| <em>Know Your Food.</em> | |
| </h1> | |
| <p class="hero__desc reveal d2"> | |
| Upload any food image. Get instant AI-powered nutrition insights, personalized health tips & smart alternatives — all in under 30 seconds. 🚀 | |
| </p> | |
| <div class="hero__btns reveal d3"> | |
| <a href="/analyzer" class="btn btn--primary">🍽️ Try Free Now →</a> | |
| <a href="/about" class="btn btn--outline">👥 Meet the Team</a> | |
| </div> | |
| <div class="hero__stats reveal d4"> | |
| <div class="hstat"><b class="counter" data-to="185">0</b><sup>+</sup><span>Food Classes</span></div> | |
| <div class="hstat-sep"></div> | |
| <div class="hstat"><b class="counter" data-to="3">0</b><span>AI Models</span></div> | |
| <div class="hstat-sep"></div> | |
| <div class="hstat"><b class="counter" data-to="99">0</b><sup>%</sup><span>Accuracy</span></div> | |
| </div> | |
| </div> | |
| <div class="hero__right reveal d2"> | |
| <div class="orbit-wrap"> | |
| <div class="orbit-core">🧠</div> | |
| <div class="orbit orbit--1"> | |
| <span class="orb-food" style="--a:0deg">🍛</span> | |
| <span class="orb-food" style="--a:120deg">🍕</span> | |
| <span class="orb-food" style="--a:240deg">🥗</span> | |
| </div> | |
| <div class="orbit orbit--2"> | |
| <span class="orb-food" style="--a:45deg">🥟</span> | |
| <span class="orb-food" style="--a:135deg">🍜</span> | |
| <span class="orb-food" style="--a:225deg">🍱</span> | |
| <span class="orb-food" style="--a:315deg">🍩</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- MARQUEE --> | |
| <div class="marquee-outer"> | |
| <div class="marquee-inner"> | |
| <div class="marquee-track"> | |
| <span>🍛 Biryani</span><span>🍕 Pizza</span><span>🥗 Salad</span> | |
| <span>🥟 Momos</span><span>🧇 Dosa</span><span>🍜 Noodles</span> | |
| <span>🧆 Samosa</span><span>🍱 Sushi</span><span>🥙 Wrap</span> | |
| <span>🍮 Gulab Jamun</span><span>🍔 Burger</span><span>🥘 Dal Makhani</span> | |
| <span>🍛 Biryani</span><span>🍕 Pizza</span><span>🥗 Salad</span> | |
| <span>🥟 Momos</span><span>🧇 Dosa</span><span>🍜 Noodles</span> | |
| <span>🧆 Samosa</span><span>🍱 Sushi</span><span>🥙 Wrap</span> | |
| <span>🍮 Gulab Jamun</span><span>🍔 Burger</span><span>🥘 Dal Makhani</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- HOW IT WORKS --> | |
| <section class="section"> | |
| <div class="container"> | |
| <div class="section-head reveal"> | |
| <span class="tag">Simple Process</span> | |
| <h2>How It Works</h2> | |
| </div> | |
| <div class="how-grid"> | |
| <div class="how-card reveal d1"> | |
| <div class="how-num">01</div> | |
| <div class="how-icon">📸</div> | |
| <h3>Upload Image</h3> | |
| <p>Drag-and-drop or click to upload any food photo. PNG, JPG, WebP supported.</p> | |
| </div> | |
| <div class="how-arrow reveal d2">→</div> | |
| <div class="how-card reveal d2"> | |
| <div class="how-num">02</div> | |
| <div class="how-icon">🤖</div> | |
| <h3>AI Detection</h3> | |
| <p>3 specialized vision models run simultaneously. Best confidence prediction wins.</p> | |
| </div> | |
| <div class="how-arrow reveal d3">→</div> | |
| <div class="how-card reveal d3"> | |
| <div class="how-num">03</div> | |
| <div class="how-icon">📊</div> | |
| <h3>Get Your Report</h3> | |
| <p>Full nutrition, health benefits, portion advice & smart alternatives — personalized to you.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- FEATURES --> | |
| <section class="section bg-card"> | |
| <div class="container"> | |
| <div class="section-head reveal"> | |
| <span class="tag">Why NutriVision</span> | |
| <h2>Built Different 🔥</h2> | |
| </div> | |
| <div class="feat-grid"> | |
| <div class="feat-card feat-card--big reveal d1"> | |
| <div class="feat-icon">🎯</div> | |
| <h3>Triple-Model Ensemble</h3> | |
| <p>Food-101 (101 classes) + Indian-Western-34 (34 classes) + our custom-trained 80-class Indian food model. All 3 run in parallel — highest confidence wins every time.</p> | |
| <div class="feat-tags"> | |
| <span>Food-101</span><span>Indian-34</span><span>Custom-80</span> | |
| </div> | |
| </div> | |
| <div class="feat-card reveal d2"> | |
| <div class="feat-icon">🧠</div> | |
| <h3>LLM Nutrition Reports</h3> | |
| <p>Llama 3.1 8B via OpenRouter generates clinically-informed, personalised nutrition data.</p> | |
| </div> | |
| <div class="feat-card reveal d3"> | |
| <div class="feat-icon">💊</div> | |
| <h3>Health-Aware Advice</h3> | |
| <p>Customised for Diabetes, Obesity, PCOD, Hypertension, Heart Disease and more.</p> | |
| </div> | |
| <div class="feat-card reveal d4"> | |
| <div class="feat-icon">🛒</div> | |
| <h3>Buy Healthier Now</h3> | |
| <p>Direct links on BigBasket, Amazon, Flipkart & Blinkit for healthier alternatives.</p> | |
| </div> | |
| <div class="feat-card reveal d5"> | |
| <div class="feat-icon">⚡</div> | |
| <h3>GPU Accelerated</h3> | |
| <p>Vision models run on CUDA T4 GPU. OpenRouter handles the LLM — zero GPU overload.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- MODEL CARDS --> | |
| <section class="section"> | |
| <div class="container"> | |
| <div class="section-head reveal"> | |
| <span class="tag">Technical Stack</span> | |
| <h2>The AI Behind It 🤖</h2> | |
| </div> | |
| <div class="model-grid"> | |
| <div class="model-card reveal d1"> | |
| <span class="model-badge">Model 1</span> | |
| <div class="model-icon">👁️</div> | |
| <h4>nateraw / food</h4> | |
| <p>Food-101 dataset — 101 international food categories.</p> | |
| <div class="model-pill">101 classes</div> | |
| </div> | |
| <div class="model-card reveal d2"> | |
| <span class="model-badge">Model 2</span> | |
| <div class="model-icon">🍛</div> | |
| <h4>Indian-Western-34</h4> | |
| <p>Samosas, Dosas, Burgers, Pizzas and 30 more popular dishes.</p> | |
| <div class="model-pill">34 classes</div> | |
| </div> | |
| <div class="model-card model-card--gold reveal d3"> | |
| <span class="model-badge model-badge--gold">✨ Our Model</span> | |
| <div class="model-icon">🎓</div> | |
| <h4>Custom Fine-Tuned</h4> | |
| <p>Trained in-house on rare Indian regional specialties — Ghevar, Adhirasam, Ariselu, Rasgulla and 76 more.</p> | |
| <div class="model-pill">80 classes</div> | |
| </div> | |
| <div class="model-card reveal d4"> | |
| <span class="model-badge">LLM</span> | |
| <div class="model-icon">💬</div> | |
| <h4>Llama 3.1 8B</h4> | |
| <p>Via OpenRouter — accurate nutritional facts and personalised health insights.</p> | |
| <div class="model-pill">OpenRouter</div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- CTA --> | |
| <section class="section"> | |
| <div class="container"> | |
| <div class="cta-block reveal"> | |
| <div class="cta-glow"></div> | |
| <h2>Ready to eat smarter? 🎯</h2> | |
| <p>Upload your food photo and get a full personalised report instantly.</p> | |
| <a href="/analyzer" class="btn btn--primary btn--lg">Start Analyzing — It's Free →</a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- FOOTER --> | |
| <footer class="footer"> | |
| <div class="container"> | |
| <div class="footer-grid"> | |
| <div> | |
| <div class="nav__logo" style="margin-bottom:0.75rem"> | |
| <span class="logo-icon">🥗</span> | |
| <span class="logo-text">NutriVision</span> | |
| </div> | |
| <p style="color:var(--muted);font-size:.9rem">AI food intelligence at your fingertips.<br/>Made with ❤️ in India.</p> | |
| </div> | |
| <div class="footer-links"> | |
| <h5>Navigate</h5> | |
| <a href="/">Home</a> | |
| <a href="/analyzer">Analyzer</a> | |
| <a href="/about">About</a> | |
| </div> | |
| <div class="footer-links"> | |
| <h5>AI Stack</h5> | |
| <span>🤖 Llama 3.1 8B (OpenRouter)</span> | |
| <span>👁️ nateraw/food</span> | |
| <span>🍛 Indian-Western-34</span> | |
| <span>🎓 Custom-80 Model</span> | |
| </div> | |
| </div> | |
| <div class="footer-bottom"> | |
| <p>© 2026 NutriVision — Built with ❤️ by Harika & Deepika & Nageswari</p> | |
| <p>⚠️ For informational purposes only. Not a substitute for medical advice.</p> | |
| </div> | |
| </div> | |
| </footer> | |
| <script src="{{ url_for('static', filename='script.js') }}"></script> | |
| </body> | |
| </html> |