diff --git a/src/App.svelte b/src/App.svelte
index 61b5b4255..ac5107881 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -13,7 +13,6 @@
   import Header from "@app/Header.svelte";
   import Loading from "@app/Loading.svelte";
   import Modal from "@app/Modal.svelte";
-  import LinearGradient from "@app/LinearGradient.svelte";
   import ColorPalette from "./ColorPalette.svelte";
 
   const loadConfig = getConfig().then(async cfg => {
@@ -113,6 +112,4 @@
       </Modal>
     </div>
   {/await}
-  <!-- Adds a svg linear gradient that can be used by any other svg under the id #gradient -->
-  <LinearGradient id="gradient" />
 </div>
diff --git a/src/Diagram.svelte b/src/Diagram.svelte
index c333e9a6c..9b045e11c 100644
--- a/src/Diagram.svelte
+++ b/src/Diagram.svelte
@@ -100,6 +100,15 @@
       </linearGradient>
     </defs>
   </svg>
+  <svg style="height: 0; width: 0;" xmlns="http://www.w3.org/2000/svg">
+    <defs>
+      <linearGradient id="gradient" x1="0" y1="1" x2="0" y2="0">
+        <stop offset="0%" stop-color="#ff55ff" stop-opacity="0.2" />
+        <stop offset="50%" stop-color="#ff55ff" stop-opacity="0.8" />
+        <stop offset="100%" stop-color="#ff55ff" stop-opacity="1" />
+      </linearGradient>
+    </defs>
+  </svg>
   {#if points.length > 0}
     <g>
       <path
diff --git a/src/LinearGradient.svelte b/src/LinearGradient.svelte
deleted file mode 100644
index fd52c50db..000000000
--- a/src/LinearGradient.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<script lang="ts">
-  export let id: string;
-  export let fillColor = "#ff55ff";
-</script>
-
-<svg style="height: 0; width: 0;" xmlns="http://www.w3.org/2000/svg">
-  <defs>
-    <linearGradient {id} x1="0" y1="1" x2="0" y2="0">
-      <stop offset="0%" stop-color={fillColor} stop-opacity="0.2" />
-      <stop offset="50%" stop-color={fillColor} stop-opacity="0.8" />
-      <stop offset="100%" stop-color={fillColor} stop-opacity="1" />
-    </linearGradient>
-  </defs>
-</svg>