diff --git a/proto/anki/collection.proto b/proto/anki/collection.proto
index de0ff08d6..330413613 100644
--- a/proto/anki/collection.proto
+++ b/proto/anki/collection.proto
@@ -20,6 +20,7 @@ service CollectionService {
   rpc LatestProgress(generic.Empty) returns (Progress);
   rpc SetWantsAbort(generic.Empty) returns (generic.Empty);
   rpc SetLoadBalancerEnabled(generic.Bool) returns (OpChanges);
+  rpc GetCustomColours(generic.Empty) returns (GetCustomColoursResponse);
 }
 
 // Implicitly includes any of the above methods that are not listed in the
@@ -163,3 +164,7 @@ message CreateBackupRequest {
   bool force = 2;
   bool wait_for_completion = 3;
 }
+
+message GetCustomColoursResponse {
+  repeated string colours = 1;
+}
diff --git a/qt/aqt/mediasrv.py b/qt/aqt/mediasrv.py
index 1a94912ee..bedf23e5b 100644
--- a/qt/aqt/mediasrv.py
+++ b/qt/aqt/mediasrv.py
@@ -630,7 +630,7 @@ def deck_options_ready() -> bytes:
 
 def save_custom_colours() -> bytes:
     colors = [
-        QColorDialog.customColor(i).name(QColor.NameFormat.HexArgb)
+        QColorDialog.customColor(i).name(QColor.NameFormat.HexRgb)
         for i in range(QColorDialog.customCount())
     ]
     aqt.mw.col.set_config("customColorPickerPalette", colors)
@@ -659,6 +659,7 @@ post_handler_list = [
 exposed_backend_list = [
     # CollectionService
     "latest_progress",
+    "get_custom_colours",
     # DeckService
     "get_deck_names",
     # I18nService
diff --git a/rslib/src/collection/service.rs b/rslib/src/collection/service.rs
index 2050a6897..a37360782 100644
--- a/rslib/src/collection/service.rs
+++ b/rslib/src/collection/service.rs
@@ -1,8 +1,10 @@
 // Copyright: Ankitects Pty Ltd and contributors
 // License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
+use anki_proto::collection::GetCustomColoursResponse;
 use anki_proto::generic;
 
 use crate::collection::Collection;
+use crate::config::ConfigKey;
 use crate::error;
 use crate::prelude::BoolKey;
 use crate::prelude::Op;
@@ -62,4 +64,13 @@ impl crate::services::CollectionService for Collection {
         })
         .map(Into::into)
     }
+
+    fn get_custom_colours(
+        &mut self,
+    ) -> error::Result<anki_proto::collection::GetCustomColoursResponse> {
+        let colours = self
+            .get_config_optional(ConfigKey::CustomColorPickerPalette)
+            .unwrap_or_default();
+        Ok(GetCustomColoursResponse { colours })
+    }
 }
diff --git a/rslib/src/config/mod.rs b/rslib/src/config/mod.rs
index 5ece5b7e1..1e507281a 100644
--- a/rslib/src/config/mod.rs
+++ b/rslib/src/config/mod.rs
@@ -71,6 +71,7 @@ pub(crate) enum ConfigKey {
     NextNewCardPosition,
     #[strum(to_string = "schedVer")]
     SchedulerVersion,
+    CustomColorPickerPalette,
 }
 
 #[derive(PartialEq, Eq, Serialize_repr, Deserialize_repr, Clone, Copy, Debug)]
diff --git a/ts/routes/image-occlusion/Toolbar.svelte b/ts/routes/image-occlusion/Toolbar.svelte
index 8775de936..5b627ffdf 100644
--- a/ts/routes/image-occlusion/Toolbar.svelte
+++ b/ts/routes/image-occlusion/Toolbar.svelte
@@ -55,6 +55,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
         onWheelDragX,
     } from "./tools/tool-zoom";
     import { fillMask } from "./tools/tool-fill";
+    import { getCustomColours, saveCustomColours } from "@generated/backend";
 
     export let canvas;
     export let iconSize;
@@ -76,6 +77,16 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     let colourRef: HTMLInputElement | undefined;
     const colour = writable(SHAPE_MASK_COLOR);
 
+    const customColorPickerPalette = writable<string[]>([]);
+
+    async function loadCustomColours() {
+        customColorPickerPalette.set(
+            (await getCustomColours({})).colours.filter(
+                (hex) => !hex.startsWith("#ffffff"),
+            ),
+        );
+    }
+
     function onClick(event: MouseEvent) {
         const upperCanvas = document.querySelector(".upper-canvas");
         if (event.target == upperCanvas) {
@@ -233,6 +244,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
             on(document, "touchstart", onTouchstart),
             on(document, "mousemove", onMousemoveDocument),
         );
+        loadCustomColours();
     });
 
     onDestroy(() => {
@@ -241,7 +253,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </script>
 
 <datalist id="colour-palette">
-    <option value={SHAPE_MASK_COLOR}></option>
+    <option>{SHAPE_MASK_COLOR}</option>
+    {#each $customColorPickerPalette as colour}
+        <option>{colour}</option>
+    {/each}
 </datalist>
 
 <input
@@ -251,6 +266,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     list="colour-palette"
     value={SHAPE_MASK_COLOR}
     on:input={(e) => ($colour = e.currentTarget!.value)}
+    on:change={() => saveCustomColours({})}
 />
 
 <div class="tool-bar-container" style:--fill-tool-colour={$colour}>