Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Reachy Mini Kickstart - Open-Source Companion Robot</title> | |
| <meta name="description" content="Reachy Mini is an expressive, open-source robot designed for human-robot interaction, creative coding, and AI experimentation."> | |
| <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=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet"> | |
| <link rel="stylesheet" href="script.css"> | |
| </head> | |
| <body> | |
| <!-- Hero Section --> | |
| <header class="hero"> | |
| <video class="hero-video" autoplay muted loop playsinline> | |
| <source src="assets/Reachy-mini-wake-up-companion.mp4" type="video/mp4"> | |
| </video> | |
| <div class="hero-overlay"></div> | |
| <div class="hero-content"> | |
| <h1>Reachy Mini</h1> | |
| <p class="hero-subtitle">The open-source companion robot for everyone.</p> | |
| <p class="hero-description"> | |
| Reachy Mini is an expressive, open-source robot designed for human-robot interaction, | |
| creative coding, and AI experimentation. | |
| </p> | |
| <div class="hero-buttons"> | |
| <a href="#kickstart" class="btn btn-primary">Kickstart your robot</a> | |
| <a href="#buy" class="btn btn-outline">Buy Reachy Mini</a> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- Kickstart Section --> | |
| <section id="kickstart" class="section"> | |
| <div class="container"> | |
| <h2 class="section-title">Kickstart your Reachy Mini</h2> | |
| <p class="section-description"> | |
| Follow these steps to assemble your robot, start it with the dashboard, explore | |
| community Spaces, and build your own experiences. | |
| </p> | |
| <!-- 1. BUILD Section --> | |
| <div class="subsection"> | |
| <div class="image-title-wrapper"> | |
| <img src="assets/Build.png" alt="Build your Reachy Mini" class="section-image section-image-lg"> | |
| </div> | |
| <div class="grid-2"> | |
| <!-- Reachy Mini --> | |
| <div class="card card-flex"> | |
| <h4 class="card-title">Reachy Mini</h4> | |
| <div class="video-wrapper"> | |
| <iframe | |
| src="https://www.youtube.com/embed/WeKKdnuXca4?si=wn-0emcMlWxpvXkO" | |
| title="YouTube video player" | |
| frameborder="0" | |
| allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" | |
| referrerpolicy="strict-origin-when-cross-origin" | |
| allowfullscreen> | |
| </iframe> | |
| </div> | |
| <a href="https://huggingface.co/spaces/pollen-robotics/Reachy_Mini_Assembly_Guide" | |
| target="_blank" | |
| class="btn btn-outline btn-full mb-4"> | |
| Open assembly guide | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| <details class="accordion"> | |
| <summary class="accordion-trigger">Connect to your Reachy Mini Wireless</summary> | |
| <div class="accordion-content"> | |
| <ol> | |
| <li>Power on your Reachy Mini.</li> | |
| <li>Reachy Mini will create its own access point: "reachy-mini-ap". It should appear in the list of available Wi-Fi networks on your computer or smartphone after a few moments.</li> | |
| <li>Connect your computer to the <code>reachy-mini-ap</code> Wi-Fi network (password: <code>reachy-mini</code>). Or you can directly scan the QR-code below to join the network:</li> | |
| </ol> | |
| <div class="qr-code-wrapper"> | |
| <img src="assets/reachy-mini-access-point-QR-code.png" alt="QR Code to connect to reachy-mini-ap" class="qr-code"> | |
| </div> | |
| <ol start="4"> | |
| <li>Open a web browser and go to <a href="http://reachy-mini.local:8000/settings" target="_blank"><code>http://reachy-mini.local:8000/settings</code></a> to access the configuration page.</li> | |
| <li>Enter your Wi-Fi network credentials (SSID and password) and click "Connect".</li> | |
| <li>Wait a few moments for Reachy Mini to connect to your Wi-Fi network. The access point will disappear once connected. If the connection fails, Reachy Mini will restart the access point, and you can try again.</li> | |
| </ol> | |
| </div> | |
| </details> | |
| </div> | |
| <!-- Reachy Mini Lite --> | |
| <div class="card card-flex"> | |
| <h4 class="card-title">Reachy Mini Lite</h4> | |
| <div class="video-wrapper"> | |
| <iframe | |
| src="https://www.youtube.com/embed/PC5Yx950nMY?si=M842ZXQsyoB-oCRj" | |
| title="YouTube video player" | |
| frameborder="0" | |
| allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" | |
| referrerpolicy="strict-origin-when-cross-origin" | |
| allowfullscreen> | |
| </iframe> | |
| </div> | |
| <a href="https://huggingface.co/spaces/pollen-robotics/Reachy_Mini_LITE_Assembly_Guide" | |
| target="_blank" | |
| class="btn btn-outline btn-full mb-4"> | |
| Open Assembly Guide (Lite version) | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| <details class="accordion"> | |
| <summary class="accordion-trigger">Connect to your Reachy Mini Lite</summary> | |
| <div class="accordion-content"> | |
| <ol> | |
| <li>Power on Reachy Mini.</li> | |
| <li>Connect Reachy Mini to your computer using the provided USB cable.</li> | |
| <li>Download the dashboard to interact with your Reachy Mini.</li> | |
| </ol> | |
| <a href="https://github.com/pollen-robotics/reachy-mini-desktop-app/releases/latest" | |
| target="_blank" | |
| class="link-tertiary link-centered"> | |
| Download dashboard | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| </div> | |
| </details> | |
| </div> | |
| </div> | |
| <p class="beta-link-text"> | |
| If you own a beta, your assembly guide is <a href="https://huggingface.co/spaces/pollen-robotics/Reachy_Mini_BETA_Assembly_Guide" target="_blank">here</a> | |
| </p> | |
| </div> | |
| <!-- 2. PLAY Section --> | |
| <div class="subsection"> | |
| <div class="image-title-wrapper"> | |
| <img src="assets/Play.png" alt="Play" class="section-image section-image-lg"> | |
| </div> | |
| <div class="grid-2"> | |
| <!-- Interactive Dashboard --> | |
| <div class="card card-flex"> | |
| <h4 class="card-title">Interactive Dashboard</h4> | |
| <div class="gif-wrapper"> | |
| <img src="assets/reachy-mini-demo-dashboard.gif" alt="Reachy Mini Dashboard Demo"> | |
| </div> | |
| <p class="card-text"> | |
| Start playing with Reachy Mini using our visual dashboard - no coding required. | |
| </p> | |
| <a href="https://github.com/pollen-robotics/reachy-mini-desktop-app/releases/tag/v0.6.0-1" target="_blank" class="btn btn-outline btn-full mt-auto"> | |
| Download dashboard | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| </div> | |
| <!-- Explore Applications --> | |
| <div class="card card-flex"> | |
| <h4 class="card-title">Explore Applications</h4> | |
| <div class="gif-wrapper"> | |
| <img src="assets/reachy-mini-hand-tracking.gif" alt="Reachy Mini Hand Tracking"> | |
| </div> | |
| <p class="card-text"> | |
| Explore the applications already developed for Reachy Mini and install them in one click via the dashboard. | |
| </p> | |
| <a href="https://huggingface.co/spaces?q=reachy+mini" | |
| target="_blank" | |
| class="btn btn-outline btn-full mt-auto"> | |
| Explore Applications | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- | |
| <!-- 3. CREATE Section | |
| <div class="subsection"> | |
| <div class="image-title-wrapper"> | |
| <img src="assets/Create.png" alt="Create" class="section-image section-image-lg"> | |
| </div> | |
| <div class="grid-3"> | |
| <!-- No Code | |
| <div class="card card-flex"> | |
| <h4 class="card-title">No Code</h4> | |
| <div class="dashboard-image-wrapper"> | |
| <img src="dashboard-discover-apps.png" alt="Reachy Mini Dashboard"> | |
| </div> | |
| <p class="card-text"> | |
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation. | |
| </p> | |
| <a href="https://github.com/iizukak/reachy_mini_turbowarp" | |
| target="_blank" | |
| class="link-tertiary link-centered"> | |
| Code with Scratch | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| </div> | |
| <!-- SDK | |
| <div class="card card-flex"> | |
| <h4 class="card-title">SDK</h4> | |
| <p class="card-text"> | |
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation. | |
| </p> | |
| <a href="https://github.com/pollen-robotics/reachy_mini" | |
| target="_blank" | |
| class="link-tertiary link-centered"> | |
| Develop native apps | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| </div> | |
| <!-- Web API | |
| <div class="card card-flex"> | |
| <h4 class="card-title">Web API</h4> | |
| <p class="card-text"> | |
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation. | |
| </p> | |
| <a href="https://huggingface.co/spaces/pollen-robotics/reachy_mini_template_app" | |
| target="_blank" | |
| class="link-tertiary link-centered"> | |
| Duplicate Template | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 4. SHARE Section | |
| <div class="subsection"> | |
| <div class="image-title-wrapper"> | |
| <img src="assets/Share.png" alt="Share" class="section-image section-image-lg"> | |
| </div> | |
| <div class="grid-2"> | |
| <!-- Share your app | |
| <div class="card card-flex"> | |
| <h4 class="card-title">Share your app with the community</h4> | |
| <div class="gif-wrapper"> | |
| <img src="assets/reachy-mini-demo-dashboard.gif" alt="Reachy Mini Dashboard Demo"> | |
| </div> | |
| <p class="card-text"> | |
| Each app can be shared on Hugging Face by making it public. Each space can receive likes and may appear in our Top Apps. | |
| </p> | |
| <a href="https://huggingface.co/spaces?q=reachy+mini" | |
| target="_blank" | |
| class="btn btn-outline btn-full mt-auto"> | |
| Browse Spaces | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| </div> | |
| <!-- Co-create | |
| <div class="card card-flex"> | |
| <h4 class="card-title">Co-create with Reachy Mini Lovers</h4> | |
| <p class="card-text"> | |
| Lorem ipsum | |
| </p> | |
| <a href="https://huggingface.co/spaces/pollen-robotics/reachy_mini_app_example" | |
| target="_blank" | |
| class="btn btn-outline btn-full mt-auto"> | |
| Duplicate template | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| --> | |
| <!-- Discord CTA --> | |
| <div class="discord-cta"> | |
| <h3>Join the Community</h3> | |
| <p> | |
| Connect with other Reachy Mini owners, share your projects, get help, and stay updated on the latest developments. | |
| </p> | |
| <a href="https://discord.gg/2bAhWfXme9" | |
| target="_blank" | |
| class="btn btn-primary"> | |
| Join Pollen Discord | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Buy Section --> | |
| <section id="buy" class="section section-muted"> | |
| <div class="container"> | |
| <h2 class="section-title">Buy Reachy Mini</h2> | |
| <p class="section-description"> | |
| Choose the version that best fits your needs. Both versions are fully compatible | |
| with our open-source tooling and Hugging Face Spaces. | |
| </p> | |
| <div class="grid-2 pricing-grid"> | |
| <!-- Wireless Version --> | |
| <div class="card pricing-card"> | |
| <div class="pricing-header"> | |
| <div class="badge badge-muted">Wireless</div> | |
| <h3 class="pricing-title">Reachy Mini</h3> | |
| <p class="pricing-price">$499</p> | |
| </div> | |
| <ul class="feature-list"> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| On-board compute (Raspberry Pi 4) | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| Works both wired and wireless | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| Wi-Fi enabled | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| 4 microphones & 5W speaker | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| Wide angle camera | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| Integrated accelerometer | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| 6 degrees of freedom head movement | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| Full body rotation | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| 2 animated antennas | |
| </li> | |
| </ul> | |
| <a href="https://buy.stripe.com/9B65kFfFlaKFbY34W873G03" | |
| target="_blank" | |
| class="btn btn-primary btn-full mt-auto"> | |
| Buy Wireless version | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| </div> | |
| <!-- Lite Version --> | |
| <div class="card pricing-card"> | |
| <div class="pricing-header"> | |
| <div class="badge badge-primary">Lite</div> | |
| <h3 class="pricing-title">Reachy Mini Lite</h3> | |
| <p class="pricing-price">$299</p> | |
| </div> | |
| <ul class="feature-list"> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| External compute (Mac & Linux, Windows soon) | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| No Wi-Fi (wired power only) | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| 4 microphones & 5W speaker | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| Wide angle camera | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| No accelerometer | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| 6 degrees of freedom head movement | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| Full body rotation | |
| </li> | |
| <li> | |
| <svg class="check-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> | |
| </svg> | |
| 2 animated antennas | |
| </li> | |
| </ul> | |
| <a href="https://buy.stripe.com/6oUfZj78P1a5e6b0FS73G02" | |
| target="_blank" | |
| class="btn btn-primary btn-full mt-auto"> | |
| Buy Lite version | |
| <svg class="icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path> | |
| </svg> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="footer"> | |
| <div class="container"> | |
| <div class="footer-content-centered"> | |
| <p>Need help? Contact us on <a href="https://discord.gg/u3QtUBhy" target="_blank" rel="noopener noreferrer">Discord</a> and join the community.</p> | |
| <p class="footer-credits">Proudly brought by <a href="https://www.pollen-robotics.com/" target="_blank" rel="noopener noreferrer">Pollen Robotics</a> x 🤗 <a href="https://huggingface.co/" target="_blank" rel="noopener noreferrer">Hugging Face</a></p> | |
| </div> | |
| </div> | |
| </footer> | |
| <!-- Documentation Button --> | |
| <a href="https://github.com/pollen-robotics/reachy_mini" | |
| target="_blank" | |
| class="doc-button"> | |
| <svg class="doc-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path> | |
| </svg> | |
| <span class="doc-text">Documentation</span> | |
| </a> | |
| <script src="script.js"></script> | |
| </body> | |
| </html> |