Upload 3 files

assets/index-CX2MTg_Z.css

@@ -0,0 +1 @@
+*{box-sizing:border-box;padding:0;margin:0;font-family:sans-serif}html,body{height:100%}body{padding:16px 32px}body,#container{display:flex;flex-direction:column;justify-content:center;align-items:center}#controls{display:flex;padding:1rem;gap:1rem}#controls>div{text-align:center}h1,h4{text-align:center}h4{margin-top:.5rem}#container{position:relative;width:720px;height:405px;max-width:100%;max-height:100%;border:2px dashed #D1D5DB;border-radius:.75rem;overflow:hidden;margin-top:1rem;background-size:100% 100%;background-position:center;background-repeat:no-repeat}#overlay,canvas{position:absolute;width:100%;height:100%}#status{min-height:16px;margin:8px 0}.bounding-box{position:absolute;box-sizing:border-box;border:solid 2px}.bounding-box-label{color:#fff;position:absolute;font-size:12px;margin:-16px 0 0 -2px;padding:1px}#video,#canvas{display:none}

index.html

@@ -5,7 +5,7 @@
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>Transformers.js | Real-time background removal</title>
-  <script type="module" crossorigin src="/assets/index-BDXRHw2c.js"></script>
+  <script type="module" crossorigin src="/assets/index-siDr-iE1.js"></script>
   <link rel="stylesheet" crossorigin href="/assets/index-CX2MTg_Z.css">
 </head>
 
@@ -24,7 +24,13 @@
     <canvas id="output-canvas" width="360" height="240"></canvas>
   </div>
   <div id="controls">
-    <div>
+    <div title="Read frames from your webcam and process them at a lower size (lower = faster)">
+      <label>Stream scale</label>
+      (<label id="scale-value">0.5</label>)
+      <br>
+      <input id="scale" type="range" min="0.1" max="1" step="0.1" value="0.5" disabled>
+    </div>
+    <div title="The length of the shortest edge of the image (lower = faster)">
       <label>Image size</label>
       (<label id="size-value">256</label>)
       <br>