--- a/devtools/client/shared/widgets/color-widget.css
+++ b/devtools/client/shared/widgets/color-widget.css
@@ -73,26 +73,28 @@ http://www.briangrinstead.com/blog/keep-
   position: absolute;
   top:0;
   left:0;
   bottom:0;
   right:0;
 }
 
 .colorwidget-contrast {
+  color: var(--theme-content-color1);
   padding-top: 4px;
 }
 
 .colorwidget-colorswatch, .colorwidget-contrast-ratio, .colorwidget-contrast-grade {
   display: inline-block;
   width: 24%;
 }
 
 .colorwidget-colorswatch {
   text-align: center;
+  color: transparent;
 }
 
 .colorwidget-color {
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   right: 20%;