diff --git a/toolkit/themes/osx/global/notification.css b/toolkit/themes/osx/global/notification.css
index 9b57766a815e..2d1c80ed2b4c 100644
--- a/toolkit/themes/osx/global/notification.css
+++ b/toolkit/themes/osx/global/notification.css
@@ -68,6 +68,20 @@ notification[type="critical"] {
   border: none;
 }
 
+/*
+ Invert the close icon for @type=info since both are normally dark. It's unclear
+ why !important is necessary here so remove it if it's no longer needed.
+*/
+notification[type="info"]:not([value="translation"]) .close-icon:not(:hover) {
+  -moz-image-region: rect(0, 64px, 16px, 48px) !important;
+}
+
+@media (min-resolution: 2dppx) {
+  notification[type="info"]:not([value="translation"]) .close-icon:not(:hover) {
+    -moz-image-region: rect(0, 128px, 32px, 96px) !important;
+  }
+}
+
 .messageCloseButton:-moz-focusring > .toolbarbutton-icon {
   border-radius: 10000px;
   box-shadow: 0 0 2px 1px -moz-mac-focusring,