gistfile1.diff

diff --git i/app/scripts/app.coffee w/app/scripts/app.coffee
index 802853c..633c952 100644
--- i/app/scripts/app.coffee
+++ w/app/scripts/app.coffee
@@ -1,5 +1,5 @@
 angular.module('ampRetirementSimulatorApp', ['ngRoute', 'ngAnimate', 'ngSanitize', 'ui.bootstrap', 'ui.slider', 'highcharts-ng', 'ampCommon'])
-  .config ($routeProvider, $locationProvider, FlowProvider, CommentaryProvider) ->
+  .config ($routeProvider, $locationProvider, FlowProvider, CommentaryProvider, colors) ->
     # Enabling HTML5 mode gives us clean URLs in modern browsers
     # but we find that it breaks when the app is served from
     # a nested location
@@ -59,6 +59,11 @@ angular.module('ampRetirementSimulatorApp', ['ngRoute', 'ngAnimate', 'ngSanitize
       templateUrl: 'views/not_found.html'
       controller: 'NotFoundCtrl'
 
+    angular.extend colors,
+      'pie-growth':        colors['ipac-yellow']
+      'pie-defensive':     colors['calculator-grey-2']
+      'chart-fill':        colors['ipac-yellow']
+
     Highcharts.setOptions
       chart:
         style:


diff --git i/app/scripts/services/chart_config.coffee w/app/scripts/services/chart_config.coffee
index 5deccfd..37ecb47 100644
--- i/app/scripts/services/chart_config.coffee
+++ w/app/scripts/services/chart_config.coffee
@@ -13,8 +13,8 @@ angular.module('ampRetirementSimulatorApp')
         animate: false
       plotOptions:
         area:
-          color: colors['amp-blue-5']
-          fillColor: colors['amp-blue-5']
+          color: colors['chart-fill']
+          fillColor: colors['chart-fill']
           fillOpacity: 1
           marker:
             enabled: false