diff --git a/python/nav/web/sass/foundation/components/_side-nav.scss b/python/nav/web/sass/foundation/components/_side-nav.scss
index d16be15713..f0b2d730ef 100644
--- a/python/nav/web/sass/foundation/components/_side-nav.scss
+++ b/python/nav/web/sass/foundation/components/_side-nav.scss
@@ -22,7 +22,7 @@ $side-nav-list-margin: rem-calc(0 0 7 0) !default;
 $side-nav-link-color: $primary-color !default;
 $side-nav-link-color-active: scale-color($side-nav-link-color, $lightness: 30%) !default;
 $side-nav-link-color-hover: scale-color($side-nav-link-color, $lightness: 30%) !default;
-$side-nav-link-bg-hover: hsla(0, 0, 0, 0.025) !default;
+$side-nav-link-bg-hover: hsla(0turn, 0%, 0%, 0.025) !default;
 $side-nav-link-margin: 0 !default;
 $side-nav-link-padding: rem-calc(7 14) !default;
 $side-nav-font-size: rem-calc(14) !default;
diff --git a/python/nav/web/sass/nav/subnet_matrix.scss b/python/nav/web/sass/nav/subnet_matrix.scss
index 9cb95a7103..23b0930293 100644
--- a/python/nav/web/sass/nav/subnet_matrix.scss
+++ b/python/nav/web/sass/nav/subnet_matrix.scss
@@ -17,7 +17,7 @@
  */
 
 $color_usage_high: #d2322d;
-$color_usage_medium: hsl(28, 100, 80);
+$color_usage_medium: hsl(28turn, 100%, 80%);
 $color_usage_low: #efe0cd;
 $color_usage_vlow: #c5d2c8;
 
@@ -40,7 +40,7 @@ $color_large: #ada7c8;
             background-color: #DDD;
             a {
                 /* Need darker colors for links with all these different backgrounds here */
-                color: hsl(200, 100, 25);
+                color: hsl(200turn, 100%, 25%);
                 &:hover { text-decoration: underline; }
             }
             .fill-cell {
@@ -76,7 +76,7 @@ $color_large: #ada7c8;
 }
 
 .tooltip {
-    a { color: hsl(200, 100, 60); }
+    a { color: hsl(200turn, 100%, 60%); }
     p { margin-bottom: 0.5rem; }
     .usage-sparkline {
         background-color: cornflowerblue;