|
<!DOCTYPE html> |
|
<html lang="en"> |
|
<head> |
|
<meta charset="utf-8" /> |
|
<meta name="description" content="" /> |
|
<link rel="icon" href="https://hf.space/embed/ai-guru/composer/static/wand.svg" /> |
|
<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=Italiana&family=Lato&display=swap" rel="stylesheet" /> |
|
<link rel="stylesheet" href="https://hf.space/embed/ai-guru/composer/static/style.css" /> |
|
<link href="https://fonts.googleapis.com/css2?family=Italiana&family=Lato&display=swap" rel="stylesheet" /> |
|
<meta name="viewport" content="width=device-width, initial-scale=1" /> |
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/4.3.2/iframeResizer.contentWindow.min.js"></script> |
|
<meta http-equiv="content-security-policy" content=""> |
|
<link rel="stylesheet" href="https://hf.space/embed/ai-guru/composer/static/_app/assets/pages/index.svelte-ad990746.css"> |
|
<link rel="modulepreload" href="https://hf.space/embed/ai-guru/composer/static/_app/start-36a09db6.js"> |
|
<link rel="modulepreload" href="https://hf.space/embed/ai-guru/composer/static/_app/chunks/index-7c452e28.js"> |
|
<link rel="modulepreload" href="https://hf.space/embed/ai-guru/composer/static/_app/chunks/index-d282aaf8.js"> |
|
<link rel="modulepreload" href="https://hf.space/embed/ai-guru/composer/static/_app/layout.svelte-6bd51f02.js"> |
|
<link rel="modulepreload" href="https://hf.space/embed/ai-guru/composer/static/_app/pages/index.svelte-9646dd5a.js"> |
|
</head> |
|
<body> |
|
<div> |
|
|
|
|
|
<main class="svelte-1rfjlkw"><h1 class="svelte-1rfjlkw">Composer</h1> |
|
<p class="heading svelte-1rfjlkw">Trained on fifteen thousand songs. One AI model. Infinite compositions.</p> |
|
<p class="svelte-1rfjlkw">This space contains a deep neural network model that can compose music. You can use it to generate audio in |
|
different styles, 4 bars at a time. |
|
</p> |
|
<p class="svelte-1rfjlkw">Developed by <a href="https://twitter.com/ronvoluted" rel="noopener" target="_blank">Ron Au</a> and |
|
<a href="https://twitter.com/DrTBehrens" rel="noopener" target="_blank">Tristan Behrens</a>. |
|
</p> |
|
<p class="svelte-1rfjlkw">Have fun! And always feel free to send us some feedback and share your compositions!</p> |
|
<section id="options" class="svelte-1rfjlkw"><fieldset class="svelte-1r9pswz"><legend class="svelte-1r9pswz">Synthesizer</legend> |
|
<div class="grid svelte-1r9pswz"><label data-selected="false" class="svelte-1r9pswz"><div class="svelte-1r9pswz"><img src="static/piano.svg" alt="Piano" class="svelte-1r9pswz"></div> |
|
<input type="radio" value="piano" class="svelte-1r9pswz"> |
|
</label><label data-selected="false" class="svelte-1r9pswz"><div class="svelte-1r9pswz"><img src="static/chamber.svg" alt="Chamber Music" class="svelte-1r9pswz"></div> |
|
<input type="radio" value="chamber" class="svelte-1r9pswz"> |
|
</label><label data-selected="false" class="svelte-1r9pswz"><div class="svelte-1r9pswz"><img src="static/rock_and_metal.svg" alt="Rock and Metal" class="svelte-1r9pswz"></div> |
|
<input type="radio" value="rock_and_metal" class="svelte-1r9pswz"> |
|
</label><label data-selected="true" class="svelte-1r9pswz"><div class="svelte-1r9pswz"><img src="static/synth.svg" alt="Synthesizer" class="svelte-1r9pswz"></div> |
|
<input type="radio" value="synth" class="svelte-1r9pswz" checked> |
|
</label><label data-selected="false" class="svelte-1r9pswz"><div class="svelte-1r9pswz"><img src="static/church.svg" alt="Church" class="svelte-1r9pswz"></div> |
|
<input type="radio" value="church" class="svelte-1r9pswz"> |
|
</label><label data-selected="false" class="svelte-1r9pswz"><div class="svelte-1r9pswz"><img src="static/timpani_strings_harp.svg" alt="Timpani, Contrabass, Harp" class="svelte-1r9pswz"></div> |
|
<input type="radio" value="timpani_strings_harp" class="svelte-1r9pswz"> |
|
</label><label data-selected="false" class="svelte-1r9pswz"><div class="svelte-1r9pswz"><img src="static/country.svg" alt="Country" class="svelte-1r9pswz"></div> |
|
<input type="radio" value="country" class="svelte-1r9pswz"> |
|
</label><label data-selected="false" class="svelte-1r9pswz"><div class="svelte-1r9pswz"><img src="static/reggae.svg" alt="Reggae-esque" class="svelte-1r9pswz"></div> |
|
<input type="radio" value="reggae" class="svelte-1r9pswz"> |
|
</label></div> |
|
</fieldset> |
|
<div><fieldset class="svelte-1ikh8be"><legend class="svelte-1ikh8be">Note density</legend> |
|
<div class="options svelte-1m848u0"><label data-selected="false" class="svelte-1m848u0">Low |
|
<input type="radio" value="low" class="svelte-1m848u0"> |
|
</label><label data-selected="true" class="svelte-1m848u0">Medium |
|
<input type="radio" value="medium" class="svelte-1m848u0" checked> |
|
</label><label data-selected="false" class="svelte-1m848u0">High |
|
<input type="radio" value="high" class="svelte-1m848u0"> |
|
</label> |
|
</div></fieldset> |
|
</div> |
|
<div><fieldset class="svelte-1ikh8be"><legend class="svelte-1ikh8be">Temperature</legend> |
|
<div class="options svelte-1m848u0"><label data-selected="false" class="svelte-1m848u0">Low |
|
<input type="radio" value="low" class="svelte-1m848u0"> |
|
</label><label data-selected="true" class="svelte-1m848u0">Medium |
|
<input type="radio" value="medium" class="svelte-1m848u0" checked> |
|
</label><label data-selected="false" class="svelte-1m848u0">High |
|
<input type="radio" value="high" class="svelte-1m848u0"> |
|
</label><label data-selected="false" class="svelte-1m848u0">Very High |
|
<input type="radio" value="very_high" class="svelte-1m848u0"> |
|
</label> |
|
</div></fieldset> |
|
</div></section> |
|
<button class="svelte-18w38ow">Compose <img src="static/wand.svg" alt="Magic wand" class="svelte-18w38ow"> |
|
</button> |
|
|
|
</main> |
|
|
|
|
|
<script type="module" data-hydrate="39sfix"> |
|
import { start } from "https://hf.space/embed/ai-guru/composer/static/_app/start-36a09db6.js"; |
|
start({ |
|
target: document.querySelector('[data-hydrate="39sfix"]').parentNode, |
|
paths: {"base":"/static","assets":"/static"}, |
|
session: {}, |
|
route: true, |
|
spa: false, |
|
trailing_slash: "never", |
|
hydrate: { |
|
status: 200, |
|
error: null, |
|
nodes: [ |
|
import("https://hf.space/embed/ai-guru/composer/static/_app/layout.svelte-6bd51f02.js"), |
|
import("https://hf.space/embed/ai-guru/composer/static/_app/pages/index.svelte-9646dd5a.js") |
|
], |
|
params: {}, |
|
routeId: "" |
|
} |
|
}); |
|
</script></div> |
|
</body> |
|
</html> |
|
|