diff --git a/proto/anki/frontend.proto b/proto/anki/frontend.proto
index 95b929c5c..1d733a369 100644
--- a/proto/anki/frontend.proto
+++ b/proto/anki/frontend.proto
@@ -27,6 +27,9 @@ service FrontendService {
   rpc deckOptionsRequireClose(generic.Empty) returns (generic.Empty);
   // Warns python that the deck option web view is ready to receive requests.
   rpc deckOptionsReady(generic.Empty) returns (generic.Empty);
+
+  // Save colour picker's custom colour palette
+  rpc SaveCustomColours(generic.Empty) returns (generic.Empty);
 }
 
 service BackendFrontendService {}
diff --git a/qt/aqt/editor.py b/qt/aqt/editor.py
index f2f267097..e86f5fe96 100644
--- a/qt/aqt/editor.py
+++ b/qt/aqt/editor.py
@@ -151,6 +151,7 @@ class Editor:
         self.add_webview()
         self.setupWeb()
         self.setupShortcuts()
+        self.setupColourPalette()
         gui_hooks.editor_did_init(self)
 
     # Initial setup
@@ -349,6 +350,14 @@ require("anki/ui").loaded.then(() => require("anki/NoteEditor").instances[0].too
                 keys, fn, _ = row
             QShortcut(QKeySequence(keys), self.widget, activated=fn)  # type: ignore
 
+    def setupColourPalette(self) -> None:
+        if not (colors := self.mw.col.get_config("customColorPickerPalette")):
+            return
+        for i, colour in enumerate(colors[: QColorDialog.customCount()]):
+            if not QColor.isValidColorName(colour):
+                continue
+            QColorDialog.setCustomColor(i, QColor.fromString(colour))
+
     def _addFocusCheck(self, fn: Callable) -> Callable:
         def checkFocus() -> None:
             if self.currentField is None:
diff --git a/qt/aqt/mediasrv.py b/qt/aqt/mediasrv.py
index 820e762d9..3a05eec2c 100644
--- a/qt/aqt/mediasrv.py
+++ b/qt/aqt/mediasrv.py
@@ -599,6 +599,15 @@ def deck_options_ready() -> bytes:
     return b""
 
 
+def save_custom_colours() -> bytes:
+    colors = [
+        QColorDialog.customColor(i).name(QColor.NameFormat.HexArgb)
+        for i in range(QColorDialog.customCount())
+    ]
+    aqt.mw.col.set_config("customColorPickerPalette", colors)
+    return b""
+
+
 post_handler_list = [
     congrats_info,
     get_deck_configs_for_update,
@@ -614,6 +623,7 @@ post_handler_list = [
     search_in_browser,
     deck_options_require_close,
     deck_options_ready,
+    save_custom_colours,
 ]
 
 
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..f89f7a99a 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;
 
@@ -134,7 +135,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
                 color = setColor(event);
                 bridgeCommand(`lastHighlightColor:${color}`);
             }}
-            on:change={() => setTextColor()}
+            on:change={() => {
+                setTextColor();
+                saveCustomColours({});
+            }}
         />
     </IconButton>
 </WithColorHelper>
diff --git a/ts/editor/editor-toolbar/TextColorButton.svelte b/ts/editor/editor-toolbar/TextColorButton.svelte
index 165953180..ce80aae49 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;
 
@@ -158,6 +159,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
                 setTimeout(() => {
                     setTextColor();
                 }, 200);
+                saveCustomColours({});
             }}
         />
     </IconButton>