diff --git a/blix-plugins/blink/src/main.cjs b/blix-plugins/blink/src/main.cjs
index 5e55a1bc..e4ab9539 100644
--- a/blix-plugins/blink/src/main.cjs
+++ b/blix-plugins/blink/src/main.cjs
@@ -346,7 +346,7 @@ const nodes = {
                     defaultValue: 100,
                     triggerUpdate: true,
                 },
-                {}
+                { min: 0 }
             );
         }
         const getTransform = addTransformInput(ui, ["position", "rotation"]);
@@ -526,7 +526,7 @@ const nodes = {
             label: "Text",
             defaultValue: "input text",
             triggerUpdate: true,
-        }, {});
+        }, { multiline: true });
 
         ui.addDropdown({
             componentId: "fontFamily",
@@ -689,16 +689,16 @@ const nodes = {
             {
                 componentId: "opacity",
                 label: "Opacity",
-                defaultValue: 100,
+                defaultValue: 1,
                 triggerUpdate: true,
             },
-            { min: 0, max: 100, set: 0.1 }
+            { min: 0, max: 1, step: 0.01 }
         );
         addTweakability(ui);
 
         nodeBuilder.define(async (input, uiInput, from) => {
             // Apply filter to outermost clump
-            const clumps = [1, 2, 3, 4, 5].map(n => input[`clump${n}`]).filter(c => c != null);
+            const clumps = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map(n => input[`clump${n}`]).filter(c => c != null);
 
             // Construct assets union
             const assets = {};
@@ -729,6 +729,192 @@ const nodes = {
         nodeBuilder.addInput("Blink clump", "clump5", "Clump 5");
         nodeBuilder.addOutput("Blink clump", "res", "Result");
     },
+    "repeat": (context) => {
+        const nodeBuilder = context.instantiate("Blink/Utils", "repeat");
+        nodeBuilder.setTitle("Repeat");
+        nodeBuilder.setDescription("Repeat a clump element multiple times with an offset");
+
+        const ui = nodeBuilder.createUIBuilder();
+        ui.addSlider(
+            {
+                componentId: "repeat",
+                label: "Repeat",
+                defaultValue: 1,
+                triggerUpdate: true,
+            },
+            { min: 0, max: 50, step: 1 }
+        );
+        ui.addNumberInput(
+            {
+                componentId: "offsetX",
+                label: "Offset X",
+                defaultValue: 0,
+                triggerUpdate: true,
+            }, { step: 1 }
+        );
+        ui.addNumberInput(
+            {
+                componentId: "offsetY",
+                label: "Offset Y",
+                defaultValue: 0,
+                triggerUpdate: true,
+            }, { step: 1 }
+        );
+        ui.addNumberInput(
+            {
+                componentId: "offsetRot",
+                label: "Rotation Offset",
+                defaultValue: 0,
+                triggerUpdate: true,
+            }, { step: 1 }
+        );
+        const getTransform = addTransformInput(ui, ["position"]);
+        ui.addSlider(
+            {
+                componentId: "opacity",
+                label: "Opacity",
+                defaultValue: 1,
+                triggerUpdate: true,
+            },
+            { min: 0, max: 1, step: 0.01 }
+        );
+        addTweakability(ui);
+
+        nodeBuilder.define(async (input, uiInput, from) => {
+            const clump = input["clump"];
+
+            if (clump == null) return { "res": null };
+
+            const assets = clump.assets;
+
+            // Construct parent clump
+            const parent = {
+                class: "clump",
+                nodeUUID: uiInput["tweaks"].nodeUUID,
+                changes: uiInput["diffs"]?.uiInputs ?? [],
+                transform: getTransform(uiInput),
+                opacity: uiInput["opacity"],
+                elements: Array.from({ length: uiInput["repeat"] }, (_, i) => ({
+                    ...clump.content,
+                    transform: {
+                        ...clump.content.transform,
+                        position: {
+                            x: clump.content.transform.position.x + i * uiInput["offsetX"],
+                            y: clump.content.transform.position.y + i * uiInput["offsetY"],
+                        },
+                        rotation: clump.content.transform.rotation + i * uiInput["offsetRot"],
+                    }
+                })),
+            }
+
+            return { "res": { assets, content: parent } };
+        });
+
+        nodeBuilder.setUI(ui);
+        nodeBuilder.addInput("Blink clump", "clump", "Clump");
+        nodeBuilder.addOutput("Blink clump", "res", "Result");
+    },
+    "particle": (context) => {
+        const nodeBuilder = context.instantiate("Blink/Utils", "particle");
+        nodeBuilder.setTitle("Particle");
+        nodeBuilder.setDescription("Scatter a clump randomly within a fixed region");
+
+        const ui = nodeBuilder.createUIBuilder();
+        ui.addSlider(
+            {
+                componentId: "count",
+                label: "Count",
+                defaultValue: 1,
+                triggerUpdate: true,
+            },
+            { min: 0, max: 50, step: 1 }
+        );
+        ui.addNumberInput(
+            {
+                componentId: "boundW",
+                label: "Bounds W",
+                defaultValue: 400,
+                triggerUpdate: true,
+            }, { min: 0, step: 1 }
+        );
+        ui.addNumberInput(
+            {
+                componentId: "boundH",
+                label: "Bounds H",
+                defaultValue: 400,
+                triggerUpdate: true,
+            }, { min: 0, step: 1 }
+        );
+        ui.addNumberInput(
+            {
+                componentId: "boundRot",
+                label: "Rotation Bound",
+                defaultValue: 0,
+                triggerUpdate: true,
+            }, { step: 1 }
+        );
+        const getTransform = addTransformInput(ui, ["position", "rotation", "scale"]);
+        ui.addSlider(
+            {
+                componentId: "opacity",
+                label: "Opacity",
+                defaultValue: 1,
+                triggerUpdate: true,
+            },
+            { min: 0, max: 1, step: 0.01 }
+        );
+        ui.addSlider(
+            {
+                componentId: "seed",
+                label: "Seed",
+                defaultValue: 1,
+                triggerUpdate: true,
+            },
+            { min: 0, max: 1000, step: 1 }
+        );
+        addTweakability(ui);
+
+
+        nodeBuilder.define(async (input, uiInput, from) => {
+            const clump = input["clump"];
+
+            if (clump == null) return { "res": null };
+
+            const assets = clump.assets;
+
+            let seed = uiInput["seed"];
+            function random() {
+                var x = Math.sin(seed++) * 10000;
+                return x - Math.floor(x);
+            }
+
+            // Construct parent clump
+            const parent = {
+                class: "clump",
+                nodeUUID: uiInput["tweaks"].nodeUUID,
+                changes: uiInput["diffs"]?.uiInputs ?? [],
+                transform: getTransform(uiInput),
+                opacity: uiInput["opacity"],
+                elements: Array.from({ length: uiInput["count"] }, (_, i) => ({
+                    ...clump.content,
+                    transform: {
+                        ...clump.content.transform,
+                        position: {
+                            x: clump.content.transform.position.x + (2*random()-1) * uiInput["boundW"],
+                            y: clump.content.transform.position.y + (2*random()-1) * uiInput["boundH"],
+                        },
+                        rotation: clump.content.transform.rotation + (2*random()-1) * uiInput["boundRot"],
+                    }
+                })),
+            }
+
+            return { "res": { assets, content: parent } };
+        });
+
+        nodeBuilder.setUI(ui);
+        nodeBuilder.addInput("Blink clump", "clump", "Clump");
+        nodeBuilder.addOutput("Blink clump", "res", "Result");
+    },
     "filter": (context) => {
         const nodeBuilder = context.instantiate("Blink/Utils", "filter");
         nodeBuilder.setTitle("Filter");
@@ -847,7 +1033,7 @@ const nodes = {
                 defaultValue: 1920,
                 triggerUpdate: true,
             },
-            { step: 1 }
+            { min: 0, step: 1 }
         );
         ui.addNumberInput(
             {
@@ -856,7 +1042,7 @@ const nodes = {
                 defaultValue: 1080,
                 triggerUpdate: true,
             },
-            { step: 1 }
+            { min: 0, step: 1 }
         );
         ui.addColorPicker({
             componentId: "canvasColor",
diff --git a/blix-plugins/blink/webview/App.svelte b/blix-plugins/blink/webview/App.svelte
index 6c3e4832..3121cc8e 100644
--- a/blix-plugins/blink/webview/App.svelte
+++ b/blix-plugins/blink/webview/App.svelte
@@ -219,6 +219,8 @@
         // link.click();
         // link.remove();
     }
+
+    let showDebug = false;
 </script>
 
 <svelte:window on:keydown={keydown} on:keyup={keyup} />
@@ -228,11 +230,26 @@
 </div>
 
 <div class="fullScreen">
+    {#if showDebug}
     <Debug data={$media} />
-    <!-- {JSON.stringify($media, null, 2)} -->
+    {/if}
+
+    <div class="hover">
+        <input type="checkbox" bind:checked="{showDebug}" />
+    </div>
 </div>
 
 <style>
+    .hover {
+        position: absolute;
+        top: 0.4em;
+        right: 0.4em;
+
+        accent-color: #f43e5c;
+        outline: none;
+        pointer-events: all;
+    }
+
     canvas {
         position: absolute;
         margin: 0px;
diff --git a/blix-plugins/blink/webview/render.ts b/blix-plugins/blink/webview/render.ts
index 623c6cd9..07b92ea0 100644
--- a/blix-plugins/blink/webview/render.ts
+++ b/blix-plugins/blink/webview/render.ts
@@ -37,7 +37,7 @@ type SelectionState = {
   prevMousePos: PIXI.Point
 };
 
-const MAX_CHILDREN_IN_CLUMP = 5;
+const MAX_CHILDREN_IN_CLUMP = 50;
 
 let selection: SelectionState = null;
 
@@ -138,6 +138,9 @@ export async function renderScene(
     await new Promise((resolve, reject) => setTimeout(resolve, 50));
   }
 
+  // Reset selection
+  // selection = null;
+
   const { pixiClump, changed } = renderClump(
     blink,
     0,
@@ -380,7 +383,7 @@ function renderClump(
 
   if (diffs.has("opacity")) {
     if (clump.opacity) {
-      resClump.alpha = Math.min(1, Math.max(0, clump.opacity / 100.0));
+      resClump.alpha = Math.min(1, Math.max(0, clump.opacity));
     }
   }
 
diff --git a/blix-plugins/input-plugin/src/main.js b/blix-plugins/input-plugin/src/main.js
index 75ff91bc..cfc9c1da 100644
--- a/blix-plugins/input-plugin/src/main.js
+++ b/blix-plugins/input-plugin/src/main.js
@@ -10,14 +10,14 @@ const nodes = {
 
         const ui = nodeBuilder.createUIBuilder();
         ui
-        .addSlider(
+        .addNumberInput(
             {
                 componentId: "value",
                 label: "Input number",
                 defaultValue: 0,
                 triggerUpdate: true,
             },
-            { min: 0, max: 100, set: 0.1 }
+            { set: 0.1 }
         );
         nodeBuilder.setUI(ui);
 
diff --git a/package-lock.json b/package-lock.json
index eba7b227..6eeefaa4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -16,7 +16,7 @@
         "@popperjs/core": "^2.11.8",
         "@types/chokidar": "^2.1.3",
         "archiver": "^6.0.1",
-        "blix_svelvet": "^1.0.19",
+        "blix_svelvet": "^1.0.20",
         "child_process": "^1.0.2",
         "chokidar": "^3.5.3",
         "cohere-ai": "^5.1.0",
@@ -5110,9 +5110,9 @@
       }
     },
     "node_modules/blix_svelvet": {
-      "version": "1.0.19",
-      "resolved": "https://registry.npmjs.org/blix_svelvet/-/blix_svelvet-1.0.19.tgz",
-      "integrity": "sha512-EwuciVuDVj1e8fXeM8QQpv7rZgUppln3abLhKinZKu/1JiwrXF4ssSH3UFGl7dmTbVP/picf6o8DcFudPsss5A==",
+      "version": "1.0.20",
+      "resolved": "https://registry.npmjs.org/blix_svelvet/-/blix_svelvet-1.0.20.tgz",
+      "integrity": "sha512-aZMNzRhTjjIbwjugH9Nq0FQ6QHXFaNHhBoc9N+lw23ZSMCINLuzInT3TBpMdt1L8hvzxWJNOq3QPNS9AhDRd2g==",
       "dependencies": {
         "abab": "^2.0.6",
         "acorn": "^8.9.0",
diff --git a/package.json b/package.json
index 84e399ab..eaad951d 100644
--- a/package.json
+++ b/package.json
@@ -78,7 +78,7 @@
     "@popperjs/core": "^2.11.8",
     "@types/chokidar": "^2.1.3",
     "archiver": "^6.0.1",
-    "blix_svelvet": "^1.0.19",
+    "blix_svelvet": "^1.0.20",
     "child_process": "^1.0.2",
     "chokidar": "^3.5.3",
     "cohere-ai": "^5.1.0",
diff --git a/src/frontend/lib/stores/GraphStore.ts b/src/frontend/lib/stores/GraphStore.ts
index d1aa42fb..0e0db4ef 100644
--- a/src/frontend/lib/stores/GraphStore.ts
+++ b/src/frontend/lib/stores/GraphStore.ts
@@ -325,7 +325,7 @@ export class GraphStore {
 
       // ===== COMPUTE CENTER OF MASS ===== //
       const centerMass = { x: 0, y: 0 };
-      const CENTER_FORCE = 0.04;
+      const CENTER_FORCE = 0.02;
       let numNodes = 0;
       nodes.forEach((node) => {
         const nodePos = this.getNode(node)?.styling?.pos;
@@ -340,40 +340,45 @@ export class GraphStore {
       centerMass.x /= numNodes;
       centerMass.y /= numNodes;
 
-      // ===== ADD EDGE DIRECTION REPULSION FORCES ===== //
-      const dirForces: { [key: GraphNodeUUID]: number } = {};
-      const DIRECTION_FORCE = 5;
-      const MAX_DIRECTION_FORCE = 800;
-
-      const edges = get(this.graphStore).edges;
-      Object.keys(edges).forEach((edge) => {
-        const edgeObj = edges[edge];
-
-        // Add leftward force
-        if (nodesSet.has(edgeObj.nodeUUIDFrom)) {
-          dirForces[edgeObj.nodeUUIDFrom] = -DIRECTION_FORCE;
-        }
-
-        // Add rightward force
-        if (nodesSet.has(edgeObj.nodeUUIDTo)) {
-          dirForces[edgeObj.nodeUUIDTo] = DIRECTION_FORCE;
-        }
-      });
-
-      let totalDirForce = 0;
       nodes.forEach((node) => {
         if (!forces[node]) forces[node] = { x: 0, y: 0 };
-        if (!dirForces[node]) dirForces[node] = 0;
+      });
 
-        dirForces[node] = Math.max(
-          Math.min(dirForces[node], MAX_DIRECTION_FORCE),
-          -MAX_DIRECTION_FORCE
-        );
-        totalDirForce += dirForces[node];
+      // ===== ADD EDGE DIRECTION REPULSION FORCES ===== //
 
-        forces[node].x += dirForces[node];
-      });
-      totalDirForce /= numNodes;
+      const totalDirForce = 0;
+      // let totalDirForce = 0;
+      // const dirForces: { [key: GraphNodeUUID]: number } = {};
+      // const DIRECTION_FORCE = 5;
+      // const MAX_DIRECTION_FORCE = 800;
+
+      // const edges = get(this.graphStore).edges;
+      // Object.keys(edges).forEach((edge) => {
+      //   const edgeObj = edges[edge];
+
+      //   // Add leftward force
+      //   if (nodesSet.has(edgeObj.nodeUUIDFrom)) {
+      //     dirForces[edgeObj.nodeUUIDFrom] = -DIRECTION_FORCE;
+      //   }
+
+      //   // Add rightward force
+      //   if (nodesSet.has(edgeObj.nodeUUIDTo)) {
+      //     dirForces[edgeObj.nodeUUIDTo] = DIRECTION_FORCE;
+      //   }
+      // });
+
+      // nodes.forEach((node) => {
+      //   if (!dirForces[node]) dirForces[node] = 0;
+
+      //   dirForces[node] = Math.max(
+      //     Math.min(dirForces[node], MAX_DIRECTION_FORCE),
+      //     -MAX_DIRECTION_FORCE
+      //   );
+      //   totalDirForce += dirForces[node];
+
+      //   forces[node].x += dirForces[node];
+      // });
+      // totalDirForce /= numNodes;
 
       // ===== ADD CENTER OF MASS ATTRACTION FORCE + COUNTERBALANCE DIRECTION FORCE ===== //
       nodes.forEach((node) => {
diff --git a/src/frontend/ui/tiles/WebView.svelte b/src/frontend/ui/tiles/WebView.svelte
index ca245d24..5a3d6792 100644
--- a/src/frontend/ui/tiles/WebView.svelte
+++ b/src/frontend/ui/tiles/WebView.svelte
@@ -95,8 +95,8 @@
     {#if src !== null}
       {#if !$blixStore.production}
         <div class="hover flex items-center space-x-2">
-          <!-- <button on:click="{reload}">Reload</button>
-          <button on:click="{openDevTools}">DevTools</button> -->
+          <button on:click="{reload}">Reload</button>
+          <button on:click="{openDevTools}">DevTools</button>
         </div>
       {/if}
 
diff --git a/src/frontend/ui/utils/graph/nodeUIComponents/Dropdown.svelte b/src/frontend/ui/utils/graph/nodeUIComponents/Dropdown.svelte
index aa24fd6c..ea8af8d0 100644
--- a/src/frontend/ui/utils/graph/nodeUIComponents/Dropdown.svelte
+++ b/src/frontend/ui/utils/graph/nodeUIComponents/Dropdown.svelte
@@ -4,6 +4,8 @@
   import type { UIComponentConfig, UIComponentProps } from "@shared/ui/NodeUITypes";
   import { createEventDispatcher } from "svelte";
 
+  const randomId = Math.random().toString(32); // TODO: Replace this (and others like it) with a global UUID function
+
   export let props: UIComponentProps;
   export let inputStore: UIValueStore;
   export let config: UIComponentConfig;
@@ -26,7 +28,12 @@
 
 {#if Object.keys(items).length > 0}
   {#key inputStore.inputs[config.componentId]}
-    <select bind:value="{$valStore}" on:change="{handleInputInteraction}">
+    <label for="{randomId}-{config.componentId}">{config.label}</label>
+    <select
+      name="{randomId}-{config.componentId}"
+      bind:value="{$valStore}"
+      on:change="{handleInputInteraction}"
+    >
       {#each Object.keys(items) as itemKey}
         <option value="{items[itemKey]}">{itemKey}</option>
       {/each}
@@ -40,6 +47,10 @@
 {/if}
 
 <style>
+  label {
+    float: left;
+  }
+
   select {
     color: #cdd6f4;
     background-color: #1f1f28;
diff --git a/src/frontend/ui/utils/graph/nodeUIComponents/TextInput.svelte b/src/frontend/ui/utils/graph/nodeUIComponents/TextInput.svelte
index 0c6f127b..195b85ec 100644
--- a/src/frontend/ui/utils/graph/nodeUIComponents/TextInput.svelte
+++ b/src/frontend/ui/utils/graph/nodeUIComponents/TextInput.svelte
@@ -6,6 +6,8 @@
   // export let label: string;
   // export let inputStore: UIValueStore;
 
+  const randomId = Math.random().toString(32); // TODO: Replace this (and others like it) with a global UUID function
+
   export let props: UIComponentProps;
   export let inputStore: UIValueStore;
   export let config: UIComponentConfig;
@@ -22,15 +24,22 @@
   }
 </script>
 
-<label
-  >{config.label}
+<label for="{randomId}-{config.componentId}"> {config.label} </label>
+{#if props?.multiline === true}
+  <textarea
+    name="{randomId}-{config.componentId}"
+    bind:value="{$valStore}"
+    on:paste="{null}"
+    on:input="{handleInteraction}"></textarea>
+{:else}
   <input
+    name="{randomId}-{config.componentId}"
     type="text"
     bind:value="{$valStore}"
     on:paste="{null}"
     on:input="{handleInteraction}"
-  /></label
->
+  />
+{/if}
 
 <style>
   label {
@@ -38,9 +47,19 @@
     /* background-color: #1f1f28; */
     border: none;
     padding: 0.1em;
+    float: left;
+  }
+
+  textarea {
+    border: 2px solid cyan;
+    color: #cdd6f4;
+    background-color: #1f1f28;
+    border: none;
+    padding: 0.1em;
+    overflow: hidden;
   }
 
-  input {
+  input[type="text"] {
     color: #cdd6f4;
     background-color: #1f1f28;
     border: none;