--- a/toolkit/components/extensions/ext-browserSettings.js
+++ b/toolkit/components/extensions/ext-browserSettings.js
@@ -372,26 +372,33 @@ this.browserSettings = class extends Ext
               Services.prefs.getIntPref(
                 "permissions.default.desktop-notification", null);
             return prefValue === PERM_DENY_ACTION;
           }),
         useDocumentColors: Object.assign(
           getSettingsAPI(
             extension, "useDocumentColors",
             () => {
-              return Services.prefs.getIntPref("browser.display.document_color_use");
+              let prefValue = Services.prefs.getIntPref("browser.display.document_color_use");
+              return prefValue === 1 ? "never" : (prefValue === 2 ? "always" : "high-contrast-only");
             }
           ),
           {
             set: details => {
-              if (![0, 1, 2].includes(details.value)) {
+              if (!["never", "always", "high-contrast-only"].includes(details.value)) {
                 throw new ExtensionError(
                   `${details.value} is not a valid value for useDocumentColors.`);
               }
+              let prefValue = 0; // initialize to 0 - auto/high-contrast-only
+              if ("never" === details.value) {
+                prefValue = 1;
+              } else if ("always" === details.value) {
+                prefValue = 2;
+              }
               return ExtensionPreferencesManager.setSetting(
-                extension.id, "useDocumentColors", details.value);
+                extension.id, "useDocumentColors", prefValue);
             },
           }
         ),
       },
     };
   }
 };

--- a/toolkit/components/extensions/test/xpcshell/test_ext_browserSettings.js
+++ b/toolkit/components/extensions/test/xpcshell/test_ext_browserSettings.js
@@ -173,27 +173,27 @@ add_task(async function test_browser_set
     {"browser.tabs.loadBookmarksInTabs": false});
 
   await testSetting(
     "openSearchResultsInNewTabs", true,
     {"browser.search.openintab": true});
   await testSetting(
     "openSearchResultsInNewTabs", false,
     {"browser.search.openintab": false});
-  
+
   await testSetting(
-    "useDocumentColors", 0,
+    "useDocumentColors", "high-contrast-only",
     {"browser.display.document_color_use": 0});
   await testSetting(
-    "useDocumentColors", 1,
+    "useDocumentColors", "never",
     {"browser.display.document_color_use": 1});
   await testSetting(
-    "useDocumentColors", 2,
+    "useDocumentColors", "always",
     {"browser.display.document_color_use": 2});
-  
+
   async function testProxy(config, expectedPrefs) {
     // proxyConfig is not supported on Android.
     if (AppConstants.platform === "android") {
       return Promise.resolve();
     }
 
     let proxyConfig = {
       proxyType: "system",
@@ -341,22 +341,22 @@ add_task(async function test_browser_set
 });
 
 add_task(async function test_bad_value() {
   async function background() {
     await browser.test.assertRejects(
       browser.browserSettings.contextMenuShowEvent.set({value: "bad"}),
       /bad is not a valid value for contextMenuShowEvent/,
       "contextMenuShowEvent.set rejects with an invalid value.");
-    
+
     await browser.test.assertRejects(
-      browser.browserSettings.useDocumentColors.set({value: 3}),
-      /3 is not a valid value for useDocumentColors/,
+      browser.browserSettings.useDocumentColors.set({value: 2}),
+      /2 is not a valid value for useDocumentColors/,
       "useDocumentColors.set rejects with an invalid value.");
-    
+
     await browser.test.assertRejects(
       browser.browserSettings.useDocumentColors.set({value: "bad"}),
       /bad is not a valid value for useDocumentColors/,
       "useDocumentColors.set rejects with an invalid value.");
 
     browser.test.sendMessage("done");
   }