define colors and apply as default

resources/frontend_client/app/card/card.services.js

@@ -2,6 +2,8 @@
 
 import _ from "underscore";
 
+import { saturated } from '../lib/colors'
+
 // Card Services
 var CardServices = angular.module('metabase.card.services', ['ngResource', 'ngCookies']);
 
@@ -294,22 +296,11 @@ CardServices.service('QueryUtils', function() {
 
 CardServices.service('VisualizationSettings', [function() {
 
-    var DEFAULT_COLOR_HARMONY = [
-        '#ac457d',
-        '#7fb846',
-        '#5994cb',
-        '#434348',
-        '#90ed7d',
-        '#f7a35c',
-        '#8085e9',
-        '#f15c80',
-        '#e4d354',
-        '#8d4653',
-        '#91e8e1',
-        '#7cb5ec'
-    ];
-
-    var DEFAULT_COLOR = DEFAULT_COLOR_HARMONY[2];
+    var DEFAULT_COLOR_HARMONY = _.map(saturated, (value) => {
+        return value;
+    })
+
+    var DEFAULT_COLOR = DEFAULT_COLOR_HARMONY[0];
 
     /* *** visualization settings ***
      *

resources/frontend_client/app/lib/colors.js

+export const normal = {
+    blue: '#509EE3',
+    green: '#9CC177',
+    purple: '#A989C5',
+    red: '#EF8C8C',
+    yellow: '#EF8C8C',
+}
+
+export const saturated = {
+    blue: '#2D86D4',
+    green: '#84BB4C',
+    purple: '#885AB1',
+    red: '#ED6E6E',
+    yellow: '#F9CF48',
+}
+
+export const desaturated = {
+    blue: '#72AFE5',
+    green: '#A8C987',
+    purple: '#B8A2CC',
+    red: '#EEA5A5',
+    yellow: '#F7D97B',
+}