diff --git a/assets/css/src/components-plugin/_toggle.scss b/assets/css/src/components-plugin/_toggle.scss
index 4841d9961e..4a38eb485a 100644
--- a/assets/css/src/components-plugin/_toggle.scss
+++ b/assets/css/src/components-plugin/_toggle.scss
@@ -49,22 +49,20 @@ input[type=checkbox].mailpoet-toggle {
   }
 }
 
-$very-light-blue: #e5e9f8;
 $apricot: #f5a278;
-$pale-grey: #fdfdff;
 
 // themes
 .mailpoet-toggle-light {
   + .mailpoet-toggle-button {
-    background: $pale-grey;
-    border: solid 1px $very-light-blue;
+    background: $color-input-background;
+    border: solid 1px $color-tertiary-light;
     border-radius: 2em;
     padding: 2px;
     transition: all .4s ease;
 
     &:after {
       background-color: #fff;
-      border: solid 1px $very-light-blue;
+      border: solid 1px $color-tertiary-light;
       border-radius: 50%;
       box-shadow: 0 4px 8px 0 rgba(220, 220, 220, .5);
       transition: all .2s ease;
diff --git a/assets/css/src/generic/_buttons.scss b/assets/css/src/generic/_buttons.scss
index ebeb4c66ba..b59b2f6cb3 100644
--- a/assets/css/src/generic/_buttons.scss
+++ b/assets/css/src/generic/_buttons.scss
@@ -49,7 +49,7 @@
 }
 
 .mailpoet-button-small {
-  font-size: $font-size - 2px;
+  font-size: $font-size-small;
   line-height: 20px;
   min-height: 32px;
   padding: 6px 12px;
diff --git a/assets/css/src/mailpoet-form-editor.scss b/assets/css/src/mailpoet-form-editor.scss
index 49875803fc..bfd7f476bd 100644
--- a/assets/css/src/mailpoet-form-editor.scss
+++ b/assets/css/src/mailpoet-form-editor.scss
@@ -1,6 +1,7 @@
 // Settings
 // Global variables, config switches. Not producing any CSS.
 
+@import 'settings/colors';
 @import 'settings/form-editor';
 
 // Tools
diff --git a/assets/css/src/settings/_colors.scss b/assets/css/src/settings/_colors.scss
index 0dd69ac607..7ab6128c9b 100644
--- a/assets/css/src/settings/_colors.scss
+++ b/assets/css/src/settings/_colors.scss
@@ -17,11 +17,18 @@ $color-secondary-light: #ffe0d0;
 $color-secondary-light-hover: darken($color-secondary-light, 10%);
 $color-tertiary: #071c6d;
 $color-tertiary-hover: darken($color-tertiary, 10%);
+$color-tertiary-light: #e5e9f8;
+$color-tertiary-hover: darken($color-tertiary-light, 10%);
 
 // Typography colors
 $color-text: $color-tertiary;
-$color-text-inactive: #9ca6cc;
-$color-text-hover: darken($color-text, 15%);
+$color-text-hover: darken($color-text, 10%);
+$color-text-light: #9ca6cc;
+$color-text-light-hover: darken($color-text-light, 10%);
+
+// Form colors
+$color-input-background: #fdfdff;
+$color-input-border: $color-tertiary-light;
 
 // Newsletter editor colors
 $color-editor-background-column: #7fbbd0;
diff --git a/assets/css/src/settings/_form-editor.scss b/assets/css/src/settings/_form-editor.scss
index e776484f68..8f938ba8bf 100644
--- a/assets/css/src/settings/_form-editor.scss
+++ b/assets/css/src/settings/_form-editor.scss
@@ -1,7 +1,7 @@
 $gutenberg-control-border-color: #7e8993;
 $gutenberg-control-active-color: #ff5301;
 $gutenberg-control-border-color-focus: #007cba;
-$form-placement-option-base-color: #e5e9f8;
+$form-placement-option-base-color: $color-tertiary-light;
 $form-placement-option-text-color: #23282d;
 $form-placement-option-oval: #dcdcdc;
 $form-placement-option-oval-border: #969ca1;
diff --git a/assets/css/src/settings/_grid.scss b/assets/css/src/settings/_grid.scss
index 4b5141b052..e593f9d9af 100644
--- a/assets/css/src/settings/_grid.scss
+++ b/assets/css/src/settings/_grid.scss
@@ -1,2 +1,4 @@
+$grid-column: 368px;
+$grid-column-small: 272px;
 $grid-editor-width: 660px;
 $grid-gap: 16px;
diff --git a/assets/css/src/settings/_typography.scss b/assets/css/src/settings/_typography.scss
index d3bbf7733d..368108e6c3 100644
--- a/assets/css/src/settings/_typography.scss
+++ b/assets/css/src/settings/_typography.scss
@@ -1,3 +1,4 @@
 $font-family: 'proxima-soft', sans-serif;
 $font-size: 16px;
+$font-size-small: 14px;
 $line-height: 1.5;