https://spleeter.online/

Submitted URL:
https://spleeter.online/
Report Finished:
LinkText
https://huggingface.co/spaces/amphion/singing_voice_conversionAmphion Singing Voice Conversion
https://huggingface.co/spaces/asigalov61/ByteDance-Solo-Piano-Audio-to-MIDI-TranscriptionByteDance Solo Piano Audio to MIDI Transcription
https://huggingface.co/openai/whisper-large-v3OpenAI Whisper
https://donate.stripe.com/9AQg2TbitaLz4HCeUU☕ Buy the guy a Coffee
https://research.deezer.com/projects/spleeter.htmlSpleeter - by Deezer
https://wavesurfer-js.org/WaveSurfer.js
https://wavesurfer-collab.web.app/WaveSurfer Collab
https://wavesurferconfigplayground.web.app/WaveSurfer Config

JavaScript Variables · 163 found

NameType
onbeforetoggleobject
documentPictureInPictureobject
onscrollendobject
gtagfunction
dataLayerobject
google_tag_managerobject
google_tag_dataobject
uidEventnumber
bootstrapobject
onYouTubeIframeAPIReadyobject

Console log messages · 0 found

HTML

<!DOCTYPE html><html lang="en"><head>
  <meta charset="utf-8">
  <title>Spleeter Online: AI Music Source Separation Platform</title>
  <meta name="description" content="Spleeter is a cutting-edge AI tool for separating vocals and instruments in music tracks. Use our online platform to effortlessly split your songs into individual tracks with just a few clicks.">
  <meta name="author" content="Kenneth Caple">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" href="favicon.ico" type="image/x-icon" alt="Spleeter Favicon">
  <meta name="keywords" content="AI music separation, Spleeter, vocals separation, instruments separation, music tracks, AI tool, audio processing">
  <meta name="robots" content="index, follow">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="language" content="English">
  <meta name="revisit-after" content="7 days">
  <meta name="distribution" content="global">
  <meta name="rating" content="general">
  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
  <script async="" src="https://www.googletagmanager.com/gtag/js?id=G-6ZPW622X6Z"></script>
  <script>window.dataLayer = window.dataLayer || []; function gtag() { dataLayer.push(arguments); } gtag('js', new Date()); gtag('config', 'G-6ZPW622X6Z');</script>
<style>@import"https://fonts.googleapis.com/css2?family=Protest+Strike&family=Updock&display=swap";@font-face{font-family:Heartbreaker;src:url(Heartbreaker.00646f6ea55815ba.woff) format("woff")}h1{text-align:center;color:#fff!important;text-decoration:none;font-size:5em;margin-top:24px!important;line-height:1em}.updock{font-family:Heartbreaker;font-size:4em;text-shadow:12px 12px 12px 12px yellow!important}.app-wrap{min-height:900px;margin-top:100px}.features .col{padding:44px;border:1px dotted #333}.fade-in{animation:fadeIn 5s ease-in-out forwards}.glow{--second-gradient-coords:110% 67%;--first-gradient-coords:-8% 32%;background-image:radial-gradient(circle closest-corner at var(--first-gradient-coords),rgba(40,72,122,.85),transparent),radial-gradient(circle closest-corner at var(--second-gradient-coords),rgba(138,41,129,.7),transparent);background-color:#07050f;color:#fff}@property --angle{syntax:"<angle>";initial-value:0deg;inherits:false}.spleeteronline{height:100px;margin-top:50px;text-decoration:none!important;text-decoration-line:none}body{overflow-x:hidden!important;width:100vw}</style><link rel="stylesheet" href="styles.11e23d6e4b43017e.css" crossorigin="anonymous" media="all" onload="this.media='all'"><noscript><link rel="stylesheet" href="styles.11e23d6e4b43017e.css"></noscript><style>a[_ngcontent-twr-c4]{color:#fff;text-decoration:none}h2[_ngcontent-twr-c4]{font-size:4em;color:#fff}@media (max-width: 639px){.stats[_ngcontent-twr-c4]{display:none}}#subheading[_ngcontent-twr-c4]{text-shadow:0px 1px 4px #000;z-index:50}#hrcontainer[_ngcontent-twr-c4]{max-width:50%;text-align:center;margin:auto}#titling[_ngcontent-twr-c4]{margin-top:60px;padding-bottom:30px}#application[_ngcontent-twr-c4]{padding:0}.spleetertuber[_ngcontent-twr-c4]{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;gap:2px 2px;grid-auto-flow:row;justify-content:center;align-content:center;justify-items:center;align-items:center;grid-template-areas:"."}.inputselector[_ngcontent-twr-c4]{display:grid;gap:2px 2px;grid-auto-flow:row;justify-content:stretch;align-content:start;justify-items:center;align-items:start;grid-template-areas:". input ."}.input[_ngcontent-twr-c4]{grid-area:input}.preview[_ngcontent-twr-c4]{grid-area:preview}#options[_ngcontent-twr-c4], #options[_ngcontent-twr-c4]   .card-body[_ngcontent-twr-c4]{background:rgba(0,0,0,0);background-blend-mode:difference}.actions-progress[_ngcontent-twr-c4]{display:grid;grid-template-columns:auto min-content;grid-template-rows:1fr;gap:12px 12px;grid-auto-flow:row;justify-content:stretch;align-content:stretch;justify-items:stretch;align-items:end;grid-template-areas:"progression actions"}#actions-progress[_ngcontent-twr-c4]   .card-body[_ngcontent-twr-c4]{min-height:70px}.progression[_ngcontent-twr-c4]{grid-area:progression;color:#fff}.actions[_ngcontent-twr-c4]{grid-area:actions}#actions-progress[_ngcontent-twr-c4], #actions-progress[_ngcontent-twr-c4]   .card-body[_ngcontent-twr-c4]{background:rgba(0,0,0,.2);background-blend-mode:difference}#options[_ngcontent-twr-c4]{margin-bottom:24px}@property --angle{syntax: "<angle>"; initial-value: 0deg; inherits: false;}.moving-border[_ngcontent-twr-c4]:before, .moving-border[_ngcontent-twr-c4]:after{content:"";position:absolute;inset:-.2rem;z-index:-1;background:linear-gradient(var(--angle),#032146,#C3F2FF,#b00);animation:_ngcontent-twr-c4_rotate 10s linear infinite}.moving-border[_ngcontent-twr-c4]:after{filter:blur(40px)}@keyframes _ngcontent-twr-c4_rotate{0%{--angle: 0deg}to{--angle: 360deg}}h1[_ngcontent-twr-c4]{font-family:Avant Garde,Avantgarde,Century Gothic,CenturyGothic,AppleGothic,sans-serif;font-size:92px;padding:80px 50px;text-align:center;text-transform:uppercase;text-rendering:optimizeLegibility}h1.elegantshadow[_ngcontent-twr-c4]{color:#131313;background-color:#e7e5e4;letter-spacing:.15em;text-shadow:1px -1px 0 #767676,-1px 2px 1px #737272,-2px 4px 1px #767474,-3px 6px 1px #787777,-4px 8px 1px #7b7a7a,-5px 10px 1px #7f7d7d,-6px 12px 1px #828181,-7px 14px 1px #868585,-8px 16px 1px #8b8a89,-9px 18px 1px #8f8e8d,-10px 20px 1px #949392,-11px 22px 1px #999897,-12px 24px 1px #9e9c9c,-13px 26px 1px #a3a1a1,-14px 28px 1px #a8a6a6,-15px 30px 1px #adabab,-16px 32px 1px #b2b1b0,-17px 34px 1px #b7b6b5,-18px 36px 1px #bcbbba,-19px 38px 1px #c1bfbf,-20px 40px 1px #c6c4c4,-21px 42px 1px #cbc9c8,-22px 44px 1px #cfcdcd,-23px 46px 1px #d4d2d1,-24px 48px 1px #d8d6d5,-25px 50px 1px #dbdad9,-26px 52px 1px #dfdddc,-27px 54px 1px #e2e0df,-28px 56px 1px #e4e3e2}h1.deepshadow[_ngcontent-twr-c4]{color:#e0dfdc;background-color:#333;letter-spacing:.1em;text-shadow:0 -1px 0 #fff,0 1px 0 #2e2e2e,0 2px 0 #2c2c2c,0 3px 0 #2a2a2a,0 4px 0 #282828,0 5px 0 #262626,0 6px 0 #242424,0 7px 0 #222,0 8px 0 #202020,0 9px 0 #1e1e1e,0 10px 0 #1c1c1c,0 11px 0 #1a1a1a,0 12px 0 #181818,0 13px 0 #161616,0 14px 0 #141414,0 15px 0 #121212,0 22px 30px rgba(0,0,0,.9)}h1.insetshadow[_ngcontent-twr-c4]{color:#202020;background-color:#2d2d2d;letter-spacing:.1em;text-shadow:-1px -1px 1px #111,2px 2px 1px #363636}h1.retroshadow[_ngcontent-twr-c4]{color:#2c2c2c;background-color:#d5d5d5;letter-spacing:.05em;text-shadow:4px 4px 0px #d5d5d5,7px 7px 0px rgba(0,0,0,.2)}</style><style>.terms[_ngcontent-twr-c0]{border:2px solid #FFF;padding:4px;text-align:left;font-size:.8em}</style></head>

<body class="glow d-flex flex-column h-100">
  <a class="fade-in spleeteronline" href="https://spleeter.online/">
    <h1 class="fade-in"><span class="updock">S</span>pleeter Online</h1>
  </a>

  <div class="app-wrap">
    <app-root _nghost-twr-c4="" ng-version="15.2.10"><div _ngcontent-twr-c4=""><app-login _ngcontent-twr-c4="" _nghost-twr-c0=""><div _ngcontent-twr-c0="" class="text-center"><div _ngcontent-twr-c0=""><button _ngcontent-twr-c0="" class="btn btn-primary"> Login with Google </button><div _ngcontent-twr-c0="" class="terms" style="font-size: .6em; margin: 20vw;">By clicking "Login with Google," you acknowledge and accept that delicious cookies will be used to maintain your session and keep you updated on the progress of the audio separation process. These cookies are provided by trusted tech giants like Google Analytics, Firebase, and Amazon Web Services. They would never, hence will never, use your vocal stems to clone your voice to somehow make the clone voice you put the pressure on your kid's kids to accept questionable terms of service. But if you don't login, those vocal stems won't even ever exist in the first place. Well, I mean they will. Enshrouded in a mystery box with at least one other stem ... the accopaniment stem. But if you don't spleet the accompaniment from the vocal stem, did it ever accompany the stem in the first place? Cookies.</div></div><!----><!----></div></app-login><!----><!----></div><!----><!----></app-root>
  </div>

  <div class="glow d-flex flex-column h-100">
    <div class="container">
      <div class="col-lg-6 mx-auto">
        <hr>
        <p class="lead mb-4">
          Remix artists can now juggle vocals and instrumentals like a circus performer on caffeine. And for those of us
          who've always wondered what our favorite songs would sound like if the drummer mysteriously vanished
          mid-performance, Spleeter has got you covered. Whether you're a professional producer or just someone who
          enjoys musical Frankenstein experiments, Spleeter opens up a world where every song is a musical LEGO set,
          ready to be taken apart and reassembled at will.</p>
        <hr>
      </div>
    </div>
  </div>

  <div class="col-lg-8 mx-auto p-4 py-md-5" id="site-info">
    <img class="d-block mx-auto mb-4" style="padding:12px;background:#FFF;width:300px;" src="assets/articles/deezer.png">
  <div class="row row-cols-1 row-cols-lg-3 align-items-stretch g-4 py-5">
    <div class="col">
      <a style="text-decoration: none;" href="/assets/articles/deezer-offices-global-locations.html"><div class="card card-cover h-100 overflow-hidden text-bg-dark rounded-4 shadow-lg" style="padding-top:100px;background-image: url('assets/articles/deezer-paris-office-staircase-1200x675.jpg');background-size:cover;background-position:center;">
        <div class="d-flex flex-column h-100 p-5 pb-3 text-white text-shadow-1">
          <h3 class="pt-5 mt-5 mb-4 display-6 lh-1 fw-bold" style="background-color:rgba(0,0,0,.6);padding:4px;">Offices &amp; Global Locations</h3>
        
        </div>
      </div></a>
    </div>
    <div class="col">
      <a style="text-decoration: none;" href="/assets/articles/deezer-streaming-music-service.html"><div class="card card-cover h-100 overflow-hidden text-bg-dark rounded-4 shadow-lg" style="padding-top:100px;background-image: url('assets/articles/streaming-music.webp');background-size:cover;background-position:center;">
        <div class="d-flex flex-column h-100 p-5 pb-3 text-white text-shadow-1">
          <h3 class="pt-5 mt-5 mb-4 display-6 lh-1 fw-bold" style="background-color:rgba(0,0,0,.6);padding:4px;">Streaming Music Service</h3>
        
        </div>
      </div></a>
    </div>
    <div class="col">
      <a style="text-decoration: none;" href="/assets/articles/how-deezer-developed-spleeter.html"><div class="card card-cover h-100 overflow-hidden text-bg-dark rounded-4 shadow-lg" style="padding-top:100px;background-image: url('assets/articles/developing-spleeter.webp');background-size:cover;background-position:center;">
        <div class="d-flex flex-column h-100 p-5 pb-3 text-white text-shadow-1">
          <h3 class="pt-5 mt-5 mb-4 display-6 lh-1 fw-bold" style="background-color:rgba(0,0,0,.6);padding:4px;">How it was made :: <small>Spleeter</small></h3>
        
        </div>
      </div></a>
    </div>


  </div></div>

  
  <div class="col-lg-8 mx-auto p-4 py-md-5" id="site-info">



    <main class="features">
      <div class="row g-4 row-cols-1 row-cols-lg-2">
        <div class="col d-flex align-items-start">
          <div>
            <h5>Singing Voice Conversion</h5>
            <p>
              Use clean vocal tracks from Spleeter.online as input for AI voice conversion tools, allowing you to
              transform vocals into different styles or mimic other voices with high accuracy for unique audio projects.
            </p>
            <p style="color:#aaa;">Free resource<br>
              <small><a target="_blank" style="color:#FFF;" href="https://huggingface.co/spaces/amphion/singing_voice_conversion">Amphion Singing Voice
                  Conversion</a></small>
            </p>
          </div>
        </div>
        <div class="col d-flex align-items-start">
          <div>
            <h5>MIDI Generation</h5>
            <p>
              Convert isolated instrumental tracks into MIDI files, enabling you to recreate, edit, or remix melodies
              and harmonies in your preferred digital audio workstation (DAW) with ease.
            </p>
            <p style="color:#aaa;">Free resource<br>
              <small><a target="_blank" style="color:#FFF;" href="https://huggingface.co/spaces/asigalov61/ByteDance-Solo-Piano-Audio-to-MIDI-Transcription">ByteDance
                  Solo Piano Audio to MIDI Transcription
                </a></small>
            </p>
          </div>
        </div>
      </div>
      <div class="row g-4 row-cols-1 row-cols-lg-3">
        <div class="col d-flex align-items-start">
          <div>
            <h5>Voice-to-Text Transcription</h5>
            <p>
              Extract vocals from tracks and use voice-to-text software to generate accurate transcriptions for lyrics,
              interviews, or podcasts, enhancing accessibility and searchability of audio content.
            </p>

            <p style="color:#aaa;">Free resource<br>
              <small><a target="_blank" style="color:#FFF;" href="https://huggingface.co/openai/whisper-large-v3">OpenAI
                  Whisper</a></small>
            </p>
          </div>
        </div>
        <div class="col d-flex align-items-start">
          <div>
            <h5>Beat Extraction for BPM</h5>
            <p>
              Use the separated drum stems to accurately extract the beat and determine the BPM, making it easier to
              synchronize tracks for DJing, remixing, or creating new compositions.
            </p>
          </div>
        </div>
        <div class="col d-flex align-items-start">
          <div>
            <h5>Sample Creation</h5>
            <p>
              Create high-quality samples by isolating specific instruments or vocals, allowing you to build a unique
              library of sounds for use in music production, sound design, or live performances.
            </p>
          </div>
        </div>
      </div>
    </main>

    <div class="container col-xxl-8 px-4 py-5">
      <div class="row flex-lg-row-reverse align-items-center g-5 py-5">
        <div class="col-lg-6">
          <p>Need to quickly validate a theory about a song? Whether you're trying to prove that a lyric is sung a
            certain way or want to isolate the drum track to analyze its pattern, Spleeter.online lets you do it all
            directly from your browser. With no need for a desktop workstation, you can instantly separate vocals or
            instruments to get the answers you need, wherever you are.
          </p>
        </div>
        <div class="col-10 col-sm-12 col-lg-6">
          <img src="/assets/spleeteronline.webp" class="d-block mx-lg-auto img-fluid" width="700" height="500" loading="lazy">
        </div>
        <hr>

        <p class="fs-5 text-center">
          Isolated vocals and instrument tracks for every occasion, available 24/7, indefinitely. Even longer than that,
          were you to, say ... <br><br> <a href="https://donate.stripe.com/9AQg2TbitaLz4HCeUU" target="_blank" class="btn btn-dark" style="display:inline !important;">☕ Buy the guy a Coffee</a>
        </p>

        <p class="fs-5 text-center">
          Spleeter Online
        </p>
      </div>
    </div>
  </div>



  <div class="show">
    <div class="container">
      <footer class="row py-5 border-top my-5 row-cols-1 row-cols-md-2 row-cols-sm-2">
        <div class="mb-3 col-6 col-sm-12 text-center">
          <h5>Spleeter Online</h5>
          <p class="mb-1"><a href="https://research.deezer.com/projects/spleeter.html">Spleeter - by Deezer</a></p>
          <p class="mb-1">Spleeter Online © 2024 Kenneth Caple</p>
        </div>
        <div class="mb-3 col-6 col-sm-12 text-center">
          <h5>Audio Projects</h5>
          <ul class="flex-column nav">
            <li class="mb-2 nav-item"><a href="https://spleeter.online" class="nav-link p-0 text-muted">Spleeter
                Online</a></li>
            <li class="mb-2 nav-item"><a href="https://wavesurfer-js.org/" class="nav-link p-0 text-muted">WaveSurfer.js</a></li>
            <li class="mb-2 nav-item"><a href="https://wavesurfer-collab.web.app/" class="nav-link p-0 text-muted">WaveSurfer Collab</a></li>
            <li class="mb-2 nav-item"><a href="https://wavesurferconfigplayground.web.app/" class="nav-link p-0 text-muted">WaveSurfer Config</a></li>
          </ul>
        </div>
      </footer>
    </div>
  </div>
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
<script src="runtime.ff54673f709f9a07.js" type="module" crossorigin="anonymous"></script><script src="polyfills.619d09a2e3332cea.js" type="module" crossorigin="anonymous"></script><script src="main.397655d44a1bc5f8.js" type="module" crossorigin="anonymous"></script>

</body></html>