diff --git a/components/style/gecko/media_queries.rs b/components/style/gecko/media_queries.rs
index 7bab0b002d1..9c10c69609d 100644
--- a/components/style/gecko/media_queries.rs
+++ b/components/style/gecko/media_queries.rs
@@ -14,7 +14,8 @@ use crate::media_queries::MediaType;
 use crate::properties::ComputedValues;
 use crate::string_cache::Atom;
 use crate::values::computed::font::GenericFontFamily;
-use crate::values::computed::Length;
+use crate::values::computed::{Length, ColorScheme};
+use crate::values::specified::color::SystemColor;
 use crate::values::specified::font::FONT_MEDIUM_PX;
 use crate::values::{CustomIdent, KeyframesName};
 use app_units::{Au, AU_PER_PX};
@@ -387,19 +388,28 @@ impl Device {
         self.pref_sheet_prefs().mUseDocumentColors
     }
 
+    /// Computes a system color and returns it as an nscolor.
+    pub(crate) fn system_nscolor(&self, system_color: SystemColor, color_scheme: &ColorScheme) -> u32 {
+        unsafe {
+            bindings::Gecko_ComputeSystemColor(system_color, self.document(), color_scheme)
+        }
+    }
+
     /// Returns the default background color.
     ///
     /// This is only for forced-colors/high-contrast, so looking at light colors
     /// is ok.
-    pub fn default_background_color_for_forced_colors(&self) -> RGBA {
-        convert_nscolor_to_rgba(self.pref_sheet_prefs().mLightColors.mDefaultBackground)
+    pub fn default_background_color(&self) -> RGBA {
+        let normal = ColorScheme::normal();
+        convert_nscolor_to_rgba(self.system_nscolor(SystemColor::Canvas, &normal))
     }
 
     /// Returns the default foreground color.
     ///
     /// See above for looking at light colors only.
-    pub fn default_color_for_forced_colors(&self) -> RGBA {
-        convert_nscolor_to_rgba(self.pref_sheet_prefs().mLightColors.mDefault)
+    pub fn default_color(&self) -> RGBA {
+        let normal = ColorScheme::normal();
+        convert_nscolor_to_rgba(self.system_nscolor(SystemColor::Canvastext, &normal))
     }
 
     /// Returns the current effective text zoom.
diff --git a/components/style/properties/cascade.rs b/components/style/properties/cascade.rs
index fe5bae33fe8..0834da93e89 100644
--- a/components/style/properties/cascade.rs
+++ b/components/style/properties/cascade.rs
@@ -430,7 +430,7 @@ fn tweak_when_ignoring_colors(
             // widget background color's rgb channels but not alpha...
             let alpha = alpha_channel(color, context);
             if alpha != 0 {
-                let mut color = context.builder.device.default_background_color_for_forced_colors();
+                let mut color = context.builder.device.default_background_color();
                 color.alpha = alpha;
                 declarations_to_apply_unless_overriden
                     .push(PropertyDeclaration::BackgroundColor(color.into()))
@@ -448,7 +448,7 @@ fn tweak_when_ignoring_colors(
             // override this with a non-transparent color, then override it with
             // the default color. Otherwise just let it inherit through.
             if context.builder.get_parent_inherited_text().clone_color().alpha == 0 {
-                let color = context.builder.device.default_color_for_forced_colors();
+                let color = context.builder.device.default_color();
                 declarations_to_apply_unless_overriden.push(PropertyDeclaration::Color(
                     specified::ColorPropertyValue(color.into()),
                 ))
diff --git a/components/style/values/specified/color.rs b/components/style/values/specified/color.rs
index 89762777f67..c2f5df4bf32 100644
--- a/components/style/values/specified/color.rs
+++ b/components/style/values/specified/color.rs
@@ -5,8 +5,6 @@
 //! Specified color values.
 
 use super::AllowQuirks;
-#[cfg(feature = "gecko")]
-use crate::gecko_bindings::structs::nscolor;
 use crate::parser::{Parse, ParserContext};
 use crate::values::computed::{Color as ComputedColor, Context, ToComputedValue};
 use crate::values::generics::color::{GenericCaretColor, GenericColorOrAuto};
@@ -456,18 +454,17 @@ impl SystemColor {
     #[inline]
     fn compute(&self, cx: &Context) -> ComputedColor {
         use crate::gecko_bindings::bindings;
+        use crate::gecko::values::convert_nscolor_to_rgba;
 
         // TODO: We should avoid cloning here most likely, though it's
         // cheap-ish.
         let style_color_scheme =
             cx.style().get_inherited_ui().clone_color_scheme();
-        let color = unsafe {
-            bindings::Gecko_ComputeSystemColor(*self, cx.device().document(), &style_color_scheme)
-        };
+        let color = cx.device().system_nscolor(*self, &style_color_scheme);
         if color == bindings::NS_SAME_AS_FOREGROUND_COLOR {
             return ComputedColor::currentcolor();
         }
-        convert_nscolor_to_computedcolor(color)
+        ComputedColor::rgba(convert_nscolor_to_rgba(color))
     }
 }
 
@@ -741,12 +738,6 @@ impl Color {
     }
 }
 
-#[cfg(feature = "gecko")]
-fn convert_nscolor_to_computedcolor(color: nscolor) -> ComputedColor {
-    use crate::gecko::values::convert_nscolor_to_rgba;
-    ComputedColor::rgba(convert_nscolor_to_rgba(color))
-}
-
 impl Color {
     /// Converts this Color into a ComputedColor.
     ///