Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Crypto LLM | Earn Crypto with Your GPU</title> | |
| <meta name="description" content="Turn your GPU into passive income. Lend your GPU to Crypto LLM, power AI, and earn crypto rewards."> | |
| <link rel="stylesheet" href="styles.css"> | |
| <link rel="icon" href="favicon.ico"> | |
| </head> | |
| <body> | |
| <!-- Navigation --> | |
| <nav class="navbar"> | |
| <div class="container nav-flex"> | |
| <a href="index.html" class="logo" aria-label="Crypto LLM Home"> | |
| <span>Crypto</span><span class="brand-highlight">LLM</span> | |
| </a> | |
| <ul class="nav-links"> | |
| <li><a href="index.html" class="active">Home</a></li> | |
| <li><a href="how-it-works.html">How it Works</a></li> | |
| <li><a href="earnings.html">Earnings</a></li> | |
| <li><a href="join.html">Join</a></li> | |
| <li><a href="faq.html">FAQ</a></li> | |
| <li><a href="about.html">About</a></li> | |
| <li><a href="contact.html">Contact</a></li> | |
| </ul> | |
| <!-- Mobile nav toggle for planned future --> | |
| <button class="nav-toggle" aria-label="Open Navigation"> | |
| <!-- TODO: Replace with hamburger icon SVG --> | |
| <span>☰</span> | |
| </button> | |
| </div> | |
| </nav> | |
| <!-- Hero Section --> | |
| <header class="hero"> | |
| <div class="container hero-flex"> | |
| <div class="hero-text"> | |
| <h1>Transform Your GPU into Passive Crypto Income</h1> | |
| <p> | |
| Lend your GPU power to Crypto LLM. Help power Large Language Models, and earn <span class="highlight">10-20% of AI profits</span> paid in crypto. <br> | |
| Simple. Secure. Decentralized. | |
| </p> | |
| <div class="hero-cta-group"> | |
| <a href="join.html" class="btn btn-primary">Get Started</a> | |
| <a href="how-it-works.html" class="btn btn-secondary">How It Works</a> | |
| </div> | |
| </div> | |
| <div class="hero-image"> | |
| <!-- TODO: Replace with a beautiful AI-oriented SVG/gpu icon --> | |
| <img src="https://www.svgrepo.com/show/506131/gpu-card.svg" width="300" alt="GPU for Crypto LLM" /> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- Features Section --> | |
| <section class="features" id="features"> | |
| <div class="container"> | |
| <h2 class="section-title">Why Choose Crypto LLM?</h2> | |
| <div class="features-grid"> | |
| <div class="feature-card"> | |
| <!-- TODO: Replace SVG with icon-crypto --> | |
| <img src="https://www.svgrepo.com/show/527293/cryptocurrency-bitcoin.svg" alt="" class="feature-icon" /> | |
| <h3>Earn in Crypto</h3> | |
| <p>Get paid directly in our token. Your AI compute, your fair share of the rewards.</p> | |
| </div> | |
| <div class="feature-card"> | |
| <!-- TODO: Replace SVG with icon-gpu --> | |
| <img src="https://www.svgrepo.com/show/506131/gpu-card.svg" alt="" class="feature-icon" /> | |
| <h3>Monetize Your Hardware</h3> | |
| <p>Put idle GPUs—desktop or server—to profitable use at any hour you choose.</p> | |
| </div> | |
| <div class="feature-card"> | |
| <!-- TODO: Replace SVG with icon-secure --> | |
| <img src="https://www.svgrepo.com/show/494405/shield-protect.svg" alt="" class="feature-icon" /> | |
| <h3>Security & Privacy First</h3> | |
| <p>Only GPU cycles are shared—never your files. Built-in sandboxing and transparency.</p> | |
| </div> | |
| <div class="feature-card"> | |
| <!-- TODO: Replace SVG with icon-community --> | |
| <img src="https://www.svgrepo.com/show/494714/users-group.svg" alt="" class="feature-icon" /> | |
| <h3>Decentralized & Open</h3> | |
| <p>Be part of a global movement building open, democratized AI. Join our thriving community.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- How it Works Section (Teaser, links to full page) --> | |
| <section class="hiw-teaser"> | |
| <div class="container hiw-teaser-flex"> | |
| <div class="hiw-steps-mini"> | |
| <div> | |
| <span class="hiw-step-number">1</span> | |
| <span>Sign Up & Install</span> | |
| </div> | |
| <div> | |
| <span class="hiw-step-number">2</span> | |
| <span>Lend Your GPU</span> | |
| </div> | |
| <div> | |
| <span class="hiw-step-number">3</span> | |
| <span>Earn Crypto</span> | |
| </div> | |
| </div> | |
| <a href="how-it-works.html" class="btn btn-outline">Learn More</a> | |
| </div> | |
| </section> | |
| <!-- Earnings Calculator Section --> | |
| <section class="earnings" id="earnings"> | |
| <div class="container"> | |
| <h2 class="section-title">Estimate Your Earnings</h2> | |
| <p>See how much passive income your GPU could generate for you.</p> | |
| <div id="calculator"> | |
| <form class="calc-form" autocomplete="off"> | |
| <label for="gpu-select">Your GPU Model:</label> | |
| <select id="gpu-select" name="gpu"> | |
| <option value="4090">NVIDIA RTX 4090</option> | |
| <option value="4080">NVIDIA RTX 4080</option> | |
| <option value="3080">NVIDIA RTX 3080</option> | |
| <option value="A100">NVIDIA A100</option> | |
| <option value="custom">Custom</option> | |
| </select> | |
| <label for="hours">Hours per day:</label> | |
| <input type="number" id="hours" name="hours" min="1" max="24" value="8" /> | |
| <button type="button" class="btn" id="calc-btn">Estimate</button> | |
| </form> | |
| <div id="calc-result"> | |
| <p>For a <span id="gpu-name">NVIDIA RTX 4090</span> running <span id="calc-hours">8</span> hrs/day:<br> | |
| <span class="earnings-range">$6.40 - $12.80</span> per day</p> | |
| </div> | |
| </div> | |
| <small>Earnings depend on demand, uptime, and hardware type. <a href="earnings.html">More details</a>.</small> | |
| </div> | |
| </section> | |
| <!-- FAQ Teaser (Links to Full FAQ) --> | |
| <section class="faq-teaser"> | |
| <div class="container faq-teaser-grid"> | |
| <div class="faq-teaser-item"> | |
| <h4>What GPUs can I use?</h4> | |
| <p>Most modern NVIDIA and AMD GPUs. See <a href="faq.html">full list</a>.</p> | |
| </div> | |
| <div class="faq-teaser-item"> | |
| <h4>How do I get paid?</h4> | |
| <p>Directly in our crypto token, viewable any time in your account. <a href="faq.html">Payment FAQ</a></p> | |
| </div> | |
| <div class="faq-teaser-item"> | |
| <h4>Is my PC safe?</h4> | |
| <p>Yes! Our client runs sandboxed—only your GPU is accessed. <a href="faq.html">Security FAQ</a></p> | |
| </div> | |
| <div class="faq-teaser-item"> | |
| <h4>How to join?</h4> | |
| <p>Create a free account and install the client. <a href="join.html">Start Now</a></p> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- CTA Section --> | |
| <section class="cta-section"> | |
| <div class="container cta-content"> | |
| <h2>Ready to Start Earning?</h2> | |
| <p>Turn your GPU into a revenue stream for the future of AI.</p> | |
| <a href="join.html" class="btn btn-primary btn-lg">Join Crypto LLM Now</a> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="footer"> | |
| <div class="container footer-flex"> | |
| <div class="footer-brand"> | |
| <a href="index.html" class="logo"> | |
| <span>Crypto</span><span class="brand-highlight">LLM</span> | |
| </a> | |
| <p>© 2025 Crypto LLM. All rights reserved.</p> | |
| </div> | |
| <nav class="footer-nav"> | |
| <ul> | |
| <li><a href="features.html">Features</a></li> | |
| <li><a href="earnings.html">Earnings</a></li> | |
| <li><a href="faq.html">FAQ</a></li> | |
| <li><a href="about.html">About</a></li> | |
| <li><a href="contact.html">Contact</a></li> | |
| </ul> | |
| </nav> | |
| <div class="footer-social"> | |
| <a href="#" aria-label="X (formerly Twitter)"><img src="https://www.svgrepo.com/show/509957/twitter-x-logo.svg" alt="X logo"></a> | |
| <a href="#" aria-label="Discord"><img src="https://www.svgrepo.com/show/353655/discord-icon.svg" alt="Discord logo"></a> | |
| <a href="#" aria-label="Telegram"><img src="https://www.svgrepo.com/show/470147/telegram.svg" alt="Telegram logo"></a> | |
| </div> | |
| </div> | |
| </footer> | |
| <script src="app.js"></script> | |
| </body> | |
| </html> |