diff --git a/core/modules/color/color.install b/core/modules/color/color.install
index c3f9a74..63162b2 100644
--- a/core/modules/color/color.install
+++ b/core/modules/color/color.install
@@ -37,3 +37,19 @@ function color_requirements($phase) {
 
   return $requirements;
 }
+
+/**
+ * Converts variables to config.
+ */
+function color_update_8001() {
+  $themes = list_themes();
+  foreach ($themes as $theme_key => $theme) {
+    update_variables_to_config('color.' . $theme_key, array(
+      'color_' . $theme_key . '_palette' => 'palette',
+      'color_' . $theme_key . '_stylesheets' => 'stylesheets',
+      'color_' . $theme_key . '_logo' => 'logo',
+      'color_' . $theme_key . '_files' => 'files',
+      'color_' . $theme_key . '_screenshot' => 'screenshot',
+    ));
+  }
+}
diff --git a/core/modules/color/color.module b/core/modules/color/color.module
index 56c04cf..c7b3550 100644
--- a/core/modules/color/color.module
+++ b/core/modules/color/color.module
@@ -65,7 +65,7 @@ function _color_html_alter(&$vars) {
   $themes = list_themes();
 
   // Override stylesheets.
-  $color_paths = variable_get('color_' . $theme_key . '_stylesheets', array());
+  $color_paths = config('color.' . $theme_key)->get('stylesheets');
   if (!empty($color_paths)) {
 
     foreach ($themes[$theme_key]->stylesheets['all'] as $base_filename => $old_path) {
@@ -99,7 +99,7 @@ function _color_page_alter(&$vars) {
   global $theme_key;
 
   // Override logo.
-  $logo = variable_get('color_' . $theme_key . '_logo');
+  $logo = config('color.' . $theme_key)->get('logo');
   if ($logo && $vars['logo'] && preg_match('!' . $theme_key . '/logo.png$!', $vars['logo'])) {
     $vars['logo'] = file_create_url($logo);
   }
@@ -132,8 +132,14 @@ function color_get_palette($theme, $default = FALSE) {
   $info = color_get_info($theme);
   $palette = $info['schemes']['default']['colors'];
 
+  if ($default) {
+    return $palette;
+  }
+
   // Load variable.
-  return $default ? $palette : variable_get('color_' . $theme . '_palette', $palette);
+  //TODO - default color config should be moved to yaml in the theme.
+  $palatte_config = config('color.' . $theme)->get('palette');
+  return $palatte_config ? $palatte_config : $palette;
 }
 
 /**
@@ -161,7 +167,7 @@ function color_scheme_form($complete_form, &$form_state, $theme) {
 
   // See if we're using a predefined scheme.
   // Note: we use the original theme when the default scheme is chosen.
-  $current_scheme = variable_get('color_' . $theme . '_palette', array());
+  $current_scheme = config('color.' . $theme)->get('palette');
   foreach ($schemes as $key => $scheme) {
     if ($current_scheme == $scheme) {
       $scheme_name = $key;
@@ -291,6 +297,7 @@ function color_scheme_form_validate($form, &$form_state) {
  * @see color_scheme_form_validate()
  */
 function color_scheme_form_submit($form, &$form_state) {
+
   // Get theme coloring info.
   if (!isset($form_state['values']['info'])) {
     return;
@@ -298,6 +305,8 @@ function color_scheme_form_submit($form, &$form_state) {
   $theme = $form_state['values']['theme'];
   $info = $form_state['values']['info'];
 
+  $config = config('color.' . $theme);
+
   // Resolve palette.
   $palette = $form_state['values']['palette'];
   if ($form_state['values']['scheme'] != '') {
@@ -332,23 +341,16 @@ function color_scheme_form_submit($form, &$form_state) {
   }
 
   // Delete old files.
-  foreach (variable_get('color_' . $theme . '_files', array()) as $file) {
-    @drupal_unlink($file);
+  $files = $config->get('files');
+  if(isset($files)) {
+    foreach ($files as $file) {
+      @drupal_unlink($file);
+    }
   }
   if (isset($file) && $file = dirname($file)) {
     @drupal_rmdir($file);
   }
 
-  // Don't render the default colorscheme, use the standard theme instead.
-  if (implode(',', color_get_palette($theme, TRUE)) == implode(',', $palette)) {
-    variable_del('color_' . $theme . '_palette');
-    variable_del('color_' . $theme . '_stylesheets');
-    variable_del('color_' . $theme . '_logo');
-    variable_del('color_' . $theme . '_files');
-    variable_del('color_' . $theme . '_screenshot');
-    return;
-  }
-
   // Prepare target locations for generated files.
   $id = $theme . '-' . substr(hash('sha256', serialize($palette) . microtime()), 0, 8);
   $paths['color'] = 'public://color';
@@ -362,8 +364,10 @@ function color_scheme_form_submit($form, &$form_state) {
   $paths['files'] = $paths['map'] = array();
 
   // Save palette and logo location.
-  variable_set('color_' . $theme . '_palette', $palette);
-  variable_set('color_' . $theme . '_logo', $paths['target'] . 'logo.png');
+  $config
+    ->set('palette', $palette)
+    ->set('logo', $paths['target'] . 'logo.png')
+    ->save();
 
   // Copy over neutral images.
   foreach ($info['copy'] as $file) {
@@ -416,8 +420,10 @@ function color_scheme_form_submit($form, &$form_state) {
   }
 
   // Maintain list of files.
-  variable_set('color_' . $theme . '_stylesheets', $css);
-  variable_set('color_' . $theme . '_files', $paths['files']);
+  $config
+    ->set('stylesheets', $css)
+    ->set('files', $paths['files'])
+    ->save();
 }
 
 /**
@@ -556,7 +562,9 @@ function _color_render_images($theme, &$info, &$paths, $palette) {
     if ($file == 'screenshot.png') {
       $slice = imagecreatetruecolor(150, 90);
       imagecopyresampled($slice, $target, 0, 0, $x, $y, 150, 90, $width, $height);
-      variable_set('color_' . $theme . '_screenshot', $image);
+      config('color.'.$theme)
+        ->set('screenshot', $image)
+        ->save();
     }
     else {
       $slice = imagecreatetruecolor($width, $height);
diff --git a/core/modules/color/lib/Drupal/color/Tests/ColorTest.php b/core/modules/color/lib/Drupal/color/Tests/ColorTest.php
index 8902d4c..8c1f74f 100644
--- a/core/modules/color/lib/Drupal/color/Tests/ColorTest.php
+++ b/core/modules/color/lib/Drupal/color/Tests/ColorTest.php
@@ -87,7 +87,7 @@ function _testColor($theme, $test_values) {
     $this->drupalPost($settings_path, $edit, t('Save configuration'));
 
     $this->drupalGet('<front>');
-    $stylesheets = variable_get('color_' . $theme . '_stylesheets', array());
+    $stylesheets = config('color.' . $theme)->get('stylesheets');
     $this->assertPattern('|' . file_create_url($stylesheets[0]) . '|', 'Make sure the color stylesheet is included in the content. (' . $theme . ')');
 
     $stylesheet_content = join("\n", file($stylesheets[0]));
@@ -99,7 +99,7 @@ function _testColor($theme, $test_values) {
     $this->drupalPost($settings_path, $edit, t('Save configuration'));
 
     $this->drupalGet('<front>');
-    $stylesheets = variable_get('color_' . $theme . '_stylesheets', array());
+    $stylesheets = config('color.' . $theme)->get('stylesheets');
     $stylesheet_content = join("\n", file($stylesheets[0]));
     $this->assertTrue(strpos($stylesheet_content, 'color: ' . $test_values['scheme_color']) !== FALSE, 'Make sure the color we changed is in the color stylesheet. (' . $theme . ')');