diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1572d3c052..b641639d85 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,10 +2,11 @@
 
 ## v.9.0.0
 
-BREAKING: 
+BREAKING:
 
-Refactored color variables.
-To upgrade to this release, the following variables must be replaced by their new names in your LESS code:
+Removed `@ffe-sand-25`, renamed other color variables.
+
+To upgrade to this release, all references to the following variables must be replaced by their new names in your LESS code:
 
 * `@ffe-blue-flat` --> `@ffe-blue-cobalt`
 * `@ffe-blue-royal-light-wcag` --> `@ffe-blue-azure`
@@ -24,6 +25,8 @@ To upgrade to this release, the following variables must be replaced by their ne
 * `@ffe-grey-light` --> `@ffe-grey-silver`
 * `@ffe-grey-dark` --> `@ffe-grey-charcoal`
 
+Instances of `@ffe-sand-25` can be replaced by `@ffe-sand`, which is the same color. 
+
 ## v.8.2.4
 
 Adjusted colors to reflect design guidelines
diff --git a/examples/colors.html b/examples/colors.html
index 2c4f8e3c84..783bf23c57 100644
--- a/examples/colors.html
+++ b/examples/colors.html
@@ -25,68 +25,68 @@ <h2 class="ffe-h2">Primær Fargepalett</h2>
                     <div class="color-patch__patch-descr">Blue-royal<br>#002776</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-flat"></div>
-                    <div class="color-patch__patch-descr">Blue-flat<br>#005AA4</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-cobalt"></div>
+                    <div class="color-patch__patch-descr">Blue-cobalt<br>#005AA4</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-royal-light"></div>
-                    <div class="color-patch__patch-descr">Blue-royal-light<br>#008ED2</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-deep-sky"></div>
+                    <div class="color-patch__patch-descr">Blue-deep-sky<br>#008ED2</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-royal-light-wcag"></div>
-                    <div class="color-patch__patch-descr">Blue-royal-light-WCAG<br>#0071CD</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-azure"></div>
+                    <div class="color-patch__patch-descr">Blue-azure<br>#0071CD</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-royal-light-50"></div>
-                    <div class="color-patch__patch-descr">Blue-royal-light-50%<br>#7FC6E8</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-sky"></div>
+                    <div class="color-patch__patch-descr">Blue-sky<br>#7FC6E8</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-royal-light-20"></div>
-                    <div class="color-patch__patch-descr">Blue-royal-light-20%<br>#DFF1F9</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-pale"></div>
+                    <div class="color-patch__patch-descr">Blue-pale<br>#DFF1F9</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-royal-light-10"></div>
-                    <div class="color-patch__patch-descr">Blue-royal-light-10%<br>#EFF8FC</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-blue-ice"></div>
+                    <div class="color-patch__patch-descr">Blue-ice<br>#EFF8FC</div>
                 </li>
                 <li class="color-patch">
                     <div class="color-patch__color-box color-patch__color-box--ffe-blue-focus"></div>
                     <div class="color-patch__patch-descr">Blue-focus<br>fade(#44C0FF, 50%)</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-green-wcag"></div>
-                    <div class="color-patch__patch-descr">Green-WCAG<br>#008A00</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-green-shamrock"></div>
+                    <div class="color-patch__patch-descr">Green-shamrock<br>#008A00</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-green-wcag-20"></div>
-                    <div class="color-patch__patch-descr">Green-WCAG-20%<br>#E1F4E3</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-green-mint"></div>
+                    <div class="color-patch__patch-descr">Green-mint<br>#E1F4E3</div>
                 </li>
                 <li class="color-patch">
                     <div class="color-patch__color-box color-patch__color-box--ffe-sand"></div>
                     <div class="color-patch__patch-descr">Sand<br>#F8F5EB</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-sand-50"></div>
-                    <div class="color-patch__patch-descr">Sand-50%<br>#FBFAF5</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-sand-ivory"></div>
+                    <div class="color-patch__patch-descr">Sand-ivory<br>#FBFAF5</div>
                 </li>
                 <li class="color-patch">
                     <div class="color-patch__color-box color-patch__color-box--ffe-black"></div>
                     <div class="color-patch__patch-descr">Black<br>#262626</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-grey-dark"></div>
-                    <div class="color-patch__patch-descr">Grey-dark<br>#676767</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-grey-charcoal"></div>
+                    <div class="color-patch__patch-descr">Grey-charcoal<br>#676767</div>
                 </li>
                 <li class="color-patch">
                     <div class="color-patch__color-box color-patch__color-box--ffe-grey"></div>
                     <div class="color-patch__patch-descr">Grey<br>#ADADAD</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-grey-light"></div>
-                    <div class="color-patch__patch-descr">Grey-light<br>#CCCCCC</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-grey-silver"></div>
+                    <div class="color-patch__patch-descr">Grey-silver<br>#CCCCCC</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-grey-light-bg"></div>
-                    <div class="color-patch__patch-descr">Grey-light-bg<br>#F4F4F4</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-grey-cloud"></div>
+                    <div class="color-patch__patch-descr">Grey-cloud<br>#F4F4F4</div>
                 </li>
                 <li class="color-patch">
                     <div class="color-patch__color-box color-patch__color-box--ffe-white"></div>
@@ -109,28 +109,28 @@ <h2 class="ffe-h2">Sekundær Fargepalett</h2>
                     <div class="color-patch__patch-descr">Green<br>#37B441</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-green-dark-10"></div>
-                    <div class="color-patch__patch-descr">Green-dark-10<br>#007B00</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-green-emerald"></div>
+                    <div class="color-patch__patch-descr">Green-emerald<br>#007B00</div>
                 </li>
                 <li class="color-patch">
                     <div class="color-patch__color-box color-patch__color-box--ffe-purple"></div>
                     <div class="color-patch__patch-descr">Purple<br>#C94096</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-purple-wcag"></div>
-                    <div class="color-patch__patch-descr">Purple-WCAG<br>#A20076</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-purple-magenta"></div>
+                    <div class="color-patch__patch-descr">Purple-magenta<br>#A20076</div>
                 </li>
                 <li class="color-patch">
                     <div class="color-patch__color-box color-patch__color-box--ffe-orange"></div>
                     <div class="color-patch__patch-descr">Orange<br>#FF9100</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-orange-wcag"></div>
-                    <div class="color-patch__patch-descr">Orange-WCAG<br>#DA3D00</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-orange-fire"></div>
+                    <div class="color-patch__patch-descr">Orange-fire<br>#DA3D00</div>
                 </li>
                 <li class="color-patch">
-                    <div class="color-patch__color-box color-patch__color-box--ffe-orange-wcag-20"></div>
-                    <div class="color-patch__patch-descr">Orange-WCAG-20%<br>#F3BBAA</div>
+                    <div class="color-patch__color-box color-patch__color-box--ffe-orange-salmon"></div>
+                    <div class="color-patch__patch-descr">Orange-salmon<br>#F3BBAA</div>
                 </li>
                 <li class="color-patch">
                     <div class="color-patch__color-box color-patch__color-box--ffe-red"></div>
diff --git a/examples/examples.less b/examples/examples.less
index 451e45559e..576590a6b9 100644
--- a/examples/examples.less
+++ b/examples/examples.less
@@ -22,23 +22,23 @@
         &--ffe-blue-royal {
             background-color: @ffe-blue-royal;
         }
-        &--ffe-blue-flat {
-            background-color: @ffe-blue-flat;
+        &--ffe-blue-cobalt {
+            background-color: @ffe-blue-cobalt;
         }
-        &--ffe-blue-royal-light {
-            background-color: @ffe-blue-royal-light;
+        &--ffe-blue-deep-sky {
+            background-color: @ffe-blue-deep-sky;
         }
-        &--ffe-blue-royal-light-wcag {
-            background-color: @ffe-blue-royal-light-wcag;
+        &--ffe-blue-azure {
+            background-color: @ffe-blue-azure;
         }
-        &--ffe-blue-royal-light-50 {
-            background-color: @ffe-blue-royal-light-50;
+        &--ffe-blue-sky {
+            background-color: @ffe-blue-sky;
         }
-        &--ffe-blue-royal-light-20 {
-            background-color: @ffe-blue-royal-light-20;
+        &--ffe-blue-pale {
+            background-color: @ffe-blue-pale;
         }
-        &--ffe-blue-royal-light-10 {
-            background-color: @ffe-blue-royal-light-10;
+        &--ffe-blue-ice {
+            background-color: @ffe-blue-ice;
         }
         &--ffe-blue-focus {
             background-color: @ffe-blue-focus;
@@ -46,35 +46,35 @@
         &--ffe-green {
             background-color: @ffe-green;
         }
-        &--ffe-green-dark-10 {
-            background-color: @ffe-green-dark-10;
+        &--ffe-green-emerald {
+            background-color: @ffe-green-emerald;
         }
-        &--ffe-green-wcag {
-            background-color: @ffe-green-wcag;
+        &--ffe-green-shamrock {
+            background-color: @ffe-green-shamrock;
         }
-        &--ffe-green-wcag-20 {
-            background-color: @ffe-green-wcag-20;
+        &--ffe-green-mint {
+            background-color: @ffe-green-mint;
         }
         &--ffe-sand {
             background-color: @ffe-sand;
         }
-        &--ffe-sand-50 {
-            background-color: @ffe-sand-50;
+        &--ffe-sand-ivory {
+            background-color: @ffe-sand-ivory;
         }
         &--ffe-black {
             background-color: @ffe-black;
         }
-        &--ffe-grey-dark {
-            background-color: @ffe-grey-dark;
+        &--ffe-grey-charcoal {
+            background-color: @ffe-grey-charcoal;
         }
         &--ffe-grey {
             background-color: @ffe-grey;
         }
-        &--ffe-grey-light {
-            background-color: @ffe-grey-light;
+        &--ffe-grey-silver {
+            background-color: @ffe-grey-silver;
         }
-        &--ffe-grey-light-bg {
-            background-color: @ffe-grey-light-bg;
+        &--ffe-grey-cloud {
+            background-color: @ffe-grey-cloud;
         }
         &--ffe-white {
             background-color: @ffe-white;
@@ -82,17 +82,17 @@
         &--ffe-purple {
             background-color: @ffe-purple;
         }
-        &--ffe-purple-wcag {
-            background-color: @ffe-purple-wcag;
+        &--ffe-purple-magenta {
+            background-color: @ffe-purple-magenta;
         }
         &--ffe-orange {
             background-color: @ffe-orange;
         }
-        &--ffe-orange-wcag {
-            background-color: @ffe-orange-wcag;
+        &--ffe-orange-fire {
+            background-color: @ffe-orange-fire;
         }
-        &--ffe-orange-wcag-20 {
-            background-color: @ffe-orange-wcag-20;
+        &--ffe-orange-salmon {
+            background-color: @ffe-orange-salmon;
         }
         &--ffe-red {
             background-color: @ffe-red;
diff --git a/less/colors.less b/less/colors.less
index 09b6c69d1a..51f56c6a95 100644
--- a/less/colors.less
+++ b/less/colors.less
@@ -4,20 +4,20 @@
 @ffe-blue-azure: #0071CD; // Secondary buttons
 @ffe-blue-deep-sky: #008ED2; // Anchor, text on ffe-white buttons, active radio buttons
 @ffe-blue-sky: #7FC6E8;
-@ffe-blue-pale: #DFF1F9; // 20% opacity of ffe-blue-royal-light. (Info-boxes, etc.)
-@ffe-blue-ice: #EFF8FC; // 10% opacity of ffe-blue-royal-light. (Expandable table rows)
+@ffe-blue-pale: #DFF1F9; // ~20% opacity of ffe-blue-deep-sky. (Info-boxes, etc.)
+@ffe-blue-ice: #EFF8FC; // ~10% opacity of ffe-blue-deep-sky. (Expandable table rows)
 @ffe-blue-focus: fade(#44C0FF, 50%); // Focus on buttons and controls
 
 // Green
 @ffe-green: #37B441; // E.g. slider tool
 @ffe-green-shamrock: #008A00; // Action buttons, slider tool, (should indicate affordance)
 @ffe-green-emerald: #007B00;
-@ffe-green-mint: #E1F4E3; // 20% opacity of ffe-green-WCAG. (Info-boxes, etc.)
+@ffe-green-mint: #E1F4E3; // ~20% opacity of ffe-green-shamrock. (Info-boxes, etc.)
 
 // Orange
 @ffe-orange: #FF9100; // Campaigns
 @ffe-orange-fire: #DA3D00; // Form validation, Error messages
-@ffe-orange-salmon: #F3BBAA; // 20% opacity of ffe-orange-WCAG. (Info-boxes, etc.)
+@ffe-orange-salmon: #F3BBAA; // ~20% opacity of ffe-orange-fire. (Info-boxes, etc.)
 
 // Red
 @ffe-red: #E60000;
diff --git a/less/layout.less b/less/layout.less
index 0277705ac9..3fbc1a4a32 100644
--- a/less/layout.less
+++ b/less/layout.less
@@ -21,16 +21,16 @@
     }
 
     &--bg-grey {
-        background-color: @ffe-grey-light-bg;
+        background-color: @ffe-grey-cloud;
         max-width: none;
     }
 
     &--bg-blue {
-        background-color: @ffe-blue-royal-light-20;
+        background-color: @ffe-blue-pale;
     }
 
     &--bg-blue-flat {
-        background-color: @ffe-blue-flat;
+        background-color: @ffe-blue-cobalt;
     }
 
     &--bg-blue-flat {
@@ -82,7 +82,7 @@
     }
 
     &--bg-grey {
-        background-color: @ffe-grey-light-bg;
+        background-color: @ffe-grey-cloud;
         padding: @app-margin 0 @app-margin 0;
     }
 
diff --git a/less/typography.less b/less/typography.less
index 8bf2a9722f..484dd0b0ab 100644
--- a/less/typography.less
+++ b/less/typography.less
@@ -48,7 +48,7 @@
 }
 
 .ffe-small-text {
-    color: @ffe-grey-dark;
+    color: @ffe-grey-charcoal;
     font-family: "MuseoSans-500", arial, sans-serif;
     font-size: 14px;
     font-weight: normal;
@@ -56,7 +56,7 @@
 }
 
 .ffe-micro-text {
-    color: @ffe-grey-dark;
+    color: @ffe-grey-charcoal;
     font-family: "MuseoSans-500", arial, sans-serif;
     font-size: 12px;
     font-weight: normal;
@@ -73,7 +73,7 @@
     margin-top: 0;
 
     &--error {
-        color: @ffe-orange-wcag;
+        color: @ffe-orange-fire;
     }
 
     &--no-margin {
@@ -81,7 +81,7 @@
     }
 
     &--with-border {
-        border-bottom: 1px solid @ffe-grey-light;
+        border-bottom: 1px solid @ffe-grey-silver;
         padding-bottom: 10px;
     }
 }
@@ -125,19 +125,19 @@
 }
 
 .ffe-link-text {
-    color: @ffe-blue-royal-light-wcag;
+    color: @ffe-blue-azure;
     text-decoration: none;
     word-wrap: break-word;
 
     &:hover {
-        color: @ffe-blue-flat;
+        color: @ffe-blue-cobalt;
         text-decoration: none;
     }
 }
 
 .ffe-divider-line {
     border: none;
-    border-bottom: solid 1px @ffe-grey-light;
+    border-bottom: solid 1px @ffe-grey-silver;
     width: 100%;
 }
 
@@ -151,7 +151,7 @@
 }
 
 .ffe-pre-text {
-    background-color: @ffe-sand-50;
+    background-color: @ffe-sand-ivory;
     font-family: consolas, menlo, monaco, monospace;
     margin: 0;
     text-align: left;
diff --git a/visual-tests/baseline-screenshots/colors/plain/firefox-large.png b/visual-tests/baseline-screenshots/colors/plain/firefox-large.png
index f480cc72ac..b2f991f7f6 100644
Binary files a/visual-tests/baseline-screenshots/colors/plain/firefox-large.png and b/visual-tests/baseline-screenshots/colors/plain/firefox-large.png differ
diff --git a/visual-tests/baseline-screenshots/colors/plain/firefox-medium.png b/visual-tests/baseline-screenshots/colors/plain/firefox-medium.png
index 7fda482ed6..6ed83b67fb 100644
Binary files a/visual-tests/baseline-screenshots/colors/plain/firefox-medium.png and b/visual-tests/baseline-screenshots/colors/plain/firefox-medium.png differ
diff --git a/visual-tests/baseline-screenshots/colors/plain/firefox-small.png b/visual-tests/baseline-screenshots/colors/plain/firefox-small.png
index aeaee80391..62fd0c487d 100644
Binary files a/visual-tests/baseline-screenshots/colors/plain/firefox-small.png and b/visual-tests/baseline-screenshots/colors/plain/firefox-small.png differ