diff --git a/public/sass/_variables.dark.generated.scss b/public/sass/_variables.dark.generated.scss
index bb7072218ef..e38f9f97351 100644
--- a/public/sass/_variables.dark.generated.scss
+++ b/public/sass/_variables.dark.generated.scss
@@ -97,12 +97,12 @@ $body-bg: #111217;
 $page-bg: #111217;
 $dashboard-bg: #111217;
 
-$text-color-strong: #fff;
+$text-color-strong: #FFFFFF;
 $text-color: rgb(204, 204, 220);
 $text-color-semi-weak: rgba(204, 204, 220, 0.65);
 $text-color-weak: rgba(204, 204, 220, 0.65);
 $text-color-faint: rgba(204, 204, 220, 0.58);
-$text-color-emphasis: #fff;
+$text-color-emphasis: #FFFFFF;
 $text-blue: #6E9FFF;
 
 $text-shadow-faint: 1px 1px 4px rgb(45, 45, 45);
@@ -116,7 +116,7 @@ $brand-gradient-vertical: linear-gradient(#f05a28 30%, #fbca0a 99%);
 // -------------------------
 $link-color: rgb(204, 204, 220);
 $link-color-disabled: rgba(204, 204, 220, 0.58);
-$link-hover-color: #fff;
+$link-hover-color: #FFFFFF;
 $external-link-color: #6E9FFF;
 
 // Typography
diff --git a/public/sass/_variables.light.generated.scss b/public/sass/_variables.light.generated.scss
index e9782c8c8f8..73da59c82cb 100644
--- a/public/sass/_variables.light.generated.scss
+++ b/public/sass/_variables.light.generated.scss
@@ -54,7 +54,7 @@ $gray-7: #fbfbfb;
 $white: #ffffff;
 
 $layer0: #F4F5F5;
-$layer1: #fff;
+$layer1: #FFFFFF;
 $layer2: #F4F5F5;
 
 $divider: rgba(36, 41, 46, 0.12);
@@ -94,11 +94,11 @@ $page-bg: #F4F5F5;
 $dashboard-bg: #F4F5F5;
 
 $text-color: rgba(36, 41, 46, 1);
-$text-color-strong: #000;
+$text-color-strong: #000000;
 $text-color-semi-weak: rgba(36, 41, 46, 0.75);
 $text-color-weak: rgba(36, 41, 46, 0.75);
 $text-color-faint: rgba(36, 41, 46, 0.50);
-$text-color-emphasis: #000;
+$text-color-emphasis: #000000;
 $text-blue: #1F62E0;
 
 $text-shadow-faint: none;
@@ -111,7 +111,7 @@ $brand-gradient-vertical: linear-gradient(#f05a28 30%, #fbca0a 99%);
 // -------------------------
 $link-color: rgba(36, 41, 46, 1);
 $link-color-disabled: rgba(36, 41, 46, 0.50);
-$link-hover-color: #000;
+$link-hover-color: #000000;
 $external-link-color: #1F62E0;
 
 // Typography
@@ -124,7 +124,7 @@ $hr-border-color: $gray-4 !default;
 
 // Panel
 // -------------------------
-$panel-bg: #fff;
+$panel-bg: #FFFFFF;
 $panel-border: 1px solid rgba(36, 41, 46, 0.12);
 $panel-header-hover-bg: rgba(36, 41, 46, 0.12);
 $panel-box-shadow: none;
@@ -141,7 +141,7 @@ $divider-border-color: $gray-2;
 $tight-form-func-bg: #F4F5F5;
 $tight-form-func-highlight-bg: #eff0f0;
 
-$modal-backdrop-bg: #fff;
+$modal-backdrop-bg: #FFFFFF;
 $code-tag-bg: $gray-6;
 $code-tag-border: $gray-4;
 
@@ -203,7 +203,7 @@ $btn-active-box-shadow: 0px 0px 4px rgba(234, 161, 51, 0.6);
 
 // Forms
 // -------------------------
-$input-bg: #fff;
+$input-bg: #FFFFFF;
 $input-bg-disabled: rgba(36, 41, 46, 0.04);
 
 $input-color: rgba(36, 41, 46, 1);
@@ -225,7 +225,7 @@ $typeahead-selected-color: $yellow;
 
 // Dropdowns
 // -------------------------
-$dropdownBackground: #fff;
+$dropdownBackground: #FFFFFF;
 $dropdownBorder: rgba(36, 41, 46, 0.12);
 $dropdownDividerTop: rgba(36, 41, 46, 0.12);
 $dropdownDividerBottom: rgba(36, 41, 46, 0.12);
@@ -259,7 +259,7 @@ $side-menu-header-color: #e9edf2;
 
 // Menu dropdowns
 // -------------------------
-$menu-dropdown-bg: #fff;
+$menu-dropdown-bg: #FFFFFF;
 $menu-dropdown-hover-bg: rgba(36, 41, 46, 0.12);
 $menu-dropdown-shadow: 0px 13px 20px 1px rgba(24, 26, 27, 0.18);
 
@@ -285,7 +285,7 @@ $tooltipArrowColor: #555;
 $tooltipBackgroundError: #E0226E;
 $tooltipShadow: 0px 4px 8px rgba(24, 26, 27, 0.2);
 
-$popover-bg: #fff;
+$popover-bg: #FFFFFF;
 $popover-color: rgba(36, 41, 46, 1);
 $popover-border-color: rgba(36, 41, 46, 0.12);
 $popover-header-bg: #F4F5F5;
@@ -301,7 +301,7 @@ $popover-error-bg: $btn-danger-bg;
 $popover-help-bg: $tooltipBackground;
 $popover-help-color: $tooltipColor;
 
-$popover-code-bg: #fff;
+$popover-code-bg: #FFFFFF;
 $popover-code-boxshadow: 0 0 5px $gray60;
 
 // images