diff --git a/ts/editor/editor-toolbar/ColorPicker.svelte b/ts/editor/editor-toolbar/ColorPicker.svelte
index 746b193a2..f5934441c 100644
--- a/ts/editor/editor-toolbar/ColorPicker.svelte
+++ b/ts/editor/editor-toolbar/ColorPicker.svelte
@@ -4,6 +4,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 -->
 <script lang="ts">
     import Shortcut from "$lib/components/Shortcut.svelte";
+    import { saveCustomColours } from "@generated/backend";
 
     export let keyCombination: string | null = null;
     export let value: string;
@@ -11,7 +12,15 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     let inputRef: HTMLInputElement;
 </script>
 
-<input bind:this={inputRef} tabindex="-1" type="color" bind:value on:input on:change />
+<input
+    bind:this={inputRef}
+    tabindex="-1"
+    type="color"
+    bind:value
+    on:input
+    on:change
+    on:click={() => saveCustomColours({})}
+/>
 
 {#if keyCombination}
     <Shortcut {keyCombination} on:action={() => inputRef.click()} />
diff --git a/ts/editor/editor-toolbar/HighlightColorButton.svelte b/ts/editor/editor-toolbar/HighlightColorButton.svelte
index 865ec5668..257f41aa5 100644
--- a/ts/editor/editor-toolbar/HighlightColorButton.svelte
+++ b/ts/editor/editor-toolbar/HighlightColorButton.svelte
@@ -19,6 +19,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     import ColorPicker from "./ColorPicker.svelte";
     import { context as editorToolbarContext } from "./EditorToolbar.svelte";
     import WithColorHelper from "./WithColorHelper.svelte";
+    import { saveCustomColours } from "@generated/backend";
 
     export let color: string;
 
@@ -133,6 +134,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
             on:input={(event) => {
                 color = setColor(event);
                 bridgeCommand(`lastHighlightColor:${color}`);
+                saveCustomColours({});
             }}
             on:change={() => setTextColor()}
         />
diff --git a/ts/editor/editor-toolbar/TextColorButton.svelte b/ts/editor/editor-toolbar/TextColorButton.svelte
index 165953180..88d5e49f4 100644
--- a/ts/editor/editor-toolbar/TextColorButton.svelte
+++ b/ts/editor/editor-toolbar/TextColorButton.svelte
@@ -22,6 +22,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     import ColorPicker from "./ColorPicker.svelte";
     import { context as editorToolbarContext } from "./EditorToolbar.svelte";
     import WithColorHelper from "./WithColorHelper.svelte";
+    import { saveCustomColours } from "@generated/backend";
 
     export let color: string;
 
@@ -152,6 +153,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
             on:input={(event) => {
                 color = setColor(event);
                 bridgeCommand(`lastTextColor:${color}`);
+                saveCustomColours({});
             }}
             on:change={() => {
                 // Delay added to work around intermittent failures on macOS/Qt6.5