Spaces:
Running on A10G
Running on A10G
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <meta name="theme-color" content="#f4f3ef" /> | |
| <meta | |
| name="description" | |
| content="Audio8 TTS Preview 0.6B multilingual voice cloning studio." | |
| /> | |
| <title>Audio8 TTS Preview 0.6B</title> | |
| <link rel="stylesheet" href="/static/styles.css" /> | |
| <script src="https://unpkg.com/lucide@0.468.0/dist/umd/lucide.min.js" defer></script> | |
| <script src="/static/app.js" defer></script> | |
| </head> | |
| <body> | |
| <header class="topbar"> | |
| <div class="topbar-inner"> | |
| <a class="brand" href="/" aria-label="Audio8 TTS Preview 0.6B"> | |
| <img src="/assets/audio8-logo.jpeg" alt="Audio8" /> | |
| <span class="brand-divider" aria-hidden="true"></span> | |
| <span class="brand-product">TTS Preview 0.6B</span> | |
| </a> | |
| <nav class="top-actions" aria-label="Product links"> | |
| <a | |
| class="icon-link" | |
| href="https://huggingface.co/Audio8/Audio8-TTS-Preview-0.6b" | |
| target="_blank" | |
| rel="noreferrer" | |
| > | |
| <i data-lucide="box" aria-hidden="true"></i> | |
| <span>Model</span> | |
| </a> | |
| <a class="icon-link" href="/docs" target="_blank"> | |
| <i data-lucide="code-2" aria-hidden="true"></i> | |
| <span>API</span> | |
| </a> | |
| <div class="runtime-status" id="runtimeStatus" aria-live="polite"> | |
| <span class="status-dot"></span> | |
| <span id="runtimeLabel">Warming up</span> | |
| </div> | |
| </nav> | |
| </div> | |
| </header> | |
| <main> | |
| <section class="title-band"> | |
| <div> | |
| <p class="eyebrow">Audio8 TTS Preview 0.6B</p> | |
| <h1>Clone a voice. Generate speech.</h1> | |
| </div> | |
| <div class="engine-mark"> | |
| <span>Multilingual</span> | |
| <span class="engine-separator">/</span> | |
| <span>44.1 kHz</span> | |
| </div> | |
| </section> | |
| <section class="studio" aria-label="Voice cloning studio"> | |
| <form id="generationForm" class="controls-column"> | |
| <section class="control-section voice-section"> | |
| <div class="section-heading"> | |
| <div> | |
| <span class="step-index">01</span> | |
| <h2>Reference voice</h2> | |
| </div> | |
| <div class="source-tabs" role="tablist" aria-label="Reference source"> | |
| <button | |
| class="source-tab active" | |
| type="button" | |
| role="tab" | |
| aria-selected="true" | |
| data-source="library" | |
| > | |
| Voices | |
| </button> | |
| <button | |
| class="source-tab" | |
| type="button" | |
| role="tab" | |
| aria-selected="false" | |
| data-source="upload" | |
| > | |
| Upload | |
| </button> | |
| </div> | |
| </div> | |
| <div id="voiceLibrary" class="voice-library" role="radiogroup"></div> | |
| <div id="uploadPanel" class="upload-panel" hidden> | |
| <label class="upload-target" for="referenceAudio"> | |
| <i data-lucide="upload" aria-hidden="true"></i> | |
| <span> | |
| <strong id="uploadTitle">Choose reference audio</strong> | |
| <small>WAV, MP3, FLAC, M4A or OGG, up to 30 seconds / 15 MB</small> | |
| </span> | |
| </label> | |
| <input | |
| id="referenceAudio" | |
| name="reference_audio" | |
| type="file" | |
| accept="audio/wav,audio/mpeg,audio/flac,audio/mp4,audio/ogg" | |
| /> | |
| <audio id="uploadPreview" controls hidden></audio> | |
| </div> | |
| <label class="field-label" for="referenceText"> | |
| Reference transcript | |
| <textarea | |
| class="reference-transcript" | |
| id="referenceText" | |
| name="reference_text" | |
| rows="2" | |
| required | |
| ></textarea> | |
| </label> | |
| </section> | |
| <section class="control-section text-section"> | |
| <div class="section-heading"> | |
| <div> | |
| <span class="step-index">02</span> | |
| <h2>Speech text</h2> | |
| </div> | |
| <span class="character-count"><span id="characterCount">0</span>/150</span> | |
| </div> | |
| <label class="sr-only" for="speechText">Text to generate</label> | |
| <textarea | |
| id="speechText" | |
| name="text" | |
| maxlength="1000" | |
| rows="6" | |
| required | |
| >Every voice carries a story. With Audio8, that story can travel across languages and reach more people.</textarea> | |
| <div class="text-presets" aria-label="Speech text presets"> | |
| <button type="button" data-preset="en">English</button> | |
| <button type="button" data-preset="zh">中文</button> | |
| <button type="button" data-preset="ja">日本語</button> | |
| <button type="button" data-preset="es">Español</button> | |
| </div> | |
| <details class="settings"> | |
| <summary> | |
| <span><i data-lucide="sliders-horizontal" aria-hidden="true"></i> Generation settings</span> | |
| <i class="chevron" data-lucide="chevron-down" aria-hidden="true"></i> | |
| </summary> | |
| <div class="settings-grid"> | |
| <label> | |
| Temperature | |
| <input name="temperature" type="number" min="0" max="2" step="0.05" value="0.8" /> | |
| </label> | |
| <label> | |
| Top P | |
| <input name="top_p" type="number" min="0.05" max="1" step="0.05" value="0.95" /> | |
| </label> | |
| <label> | |
| Top K | |
| <input name="top_k" type="number" min="1" max="200" step="1" value="50" /> | |
| </label> | |
| <label> | |
| Max tokens | |
| <input name="max_new_tokens" type="number" min="32" max="1024" step="32" value="1024" /> | |
| </label> | |
| </div> | |
| </details> | |
| <label class="consent-row"> | |
| <input id="consent" type="checkbox" required /> | |
| <span>I have permission to use this reference voice.</span> | |
| </label> | |
| <button id="generateButton" class="generate-button" type="submit" disabled> | |
| <i data-lucide="audio-lines" aria-hidden="true"></i> | |
| <span>Generate speech</span> | |
| <kbd>Audio8</kbd> | |
| </button> | |
| </section> | |
| </form> | |
| <aside class="output-column" aria-labelledby="outputHeading"> | |
| <div class="output-heading-row"> | |
| <div> | |
| <span class="step-index">03</span> | |
| <h2 id="outputHeading">Generated audio</h2> | |
| </div> | |
| <span id="resultBadge" class="result-badge" hidden>Ready</span> | |
| </div> | |
| <div id="emptyOutput" class="empty-output"> | |
| <div class="wave-display" aria-hidden="true"> | |
| <span></span><span></span><span></span><span></span><span></span> | |
| <span></span><span></span><span></span><span></span><span></span> | |
| <span></span><span></span><span></span><span></span><span></span> | |
| </div> | |
| <p>Your generated voice will appear here.</p> | |
| <span>WAV / 44.1 kHz</span> | |
| </div> | |
| <div id="loadingOutput" class="loading-output" hidden aria-live="polite"> | |
| <div class="processing-mark" aria-hidden="true"> | |
| <span></span><span></span><span></span><span></span><span></span> | |
| </div> | |
| <strong id="loadingTitle">Encoding reference voice</strong> | |
| <span id="elapsedTime">0.0s</span> | |
| </div> | |
| <div id="resultOutput" class="result-output" hidden> | |
| <canvas id="resultWaveform" width="960" height="180"></canvas> | |
| <audio id="resultAudio" controls></audio> | |
| <div class="result-metrics"> | |
| <div> | |
| <span>Generation</span> | |
| <strong id="generationTime">--</strong> | |
| </div> | |
| <div> | |
| <span>Audio</span> | |
| <strong id="audioDuration">--</strong> | |
| </div> | |
| <div> | |
| <span>Model</span> | |
| <strong>Audio8 0.6B</strong> | |
| </div> | |
| </div> | |
| <a id="downloadButton" class="download-button" download="audio8-clone.wav"> | |
| <i data-lucide="download" aria-hidden="true"></i> | |
| Download WAV | |
| </a> | |
| </div> | |
| <div id="errorOutput" class="error-output" hidden role="alert"> | |
| <i data-lucide="circle-alert" aria-hidden="true"></i> | |
| <div> | |
| <strong>Generation failed</strong> | |
| <p id="errorMessage"></p> | |
| </div> | |
| </div> | |
| </aside> | |
| </section> | |
| </main> | |
| <footer> | |
| <span>Audio8 TTS Preview</span> | |
| <span>Use cloned voices with consent and disclose synthetic audio.</span> | |
| </footer> | |
| </body> | |
| </html> | |