Custom color theme when using Angular CLI and Materialize CSS

It's time for another "I tried to google this problem but couldn't find anything" post. Recently I've been working on an Angular2 & Angular CLI app with material design via Materialize CSS and the angular2-materialize wrapper. The angular2-materialize github page has some good examples about how to set it up, but if you follow those instructions you'll end up with a "unique" pink and green color scheme, which many people like me will want to change immediately. It took a bit of doing to figure out how to do that without needing to manually apply a CSS color class to every element, so I thought I should write down what I did. It basically just boils down to Using a Sass main style, and updating it so that it looks something like:

/* This must be included to use the included variables and the color function */
@import "../node_modules/materialize-css/sass/components/color"; 

$primary-color: color("indigo", "base");
$secondary-color: color("blue", "lighten-1");

/* This is needed so the materialize.scss file can load the font */
$roboto-font-path: "../node_modules/materialize-css/fonts/roboto/"; 

@import "../node_modules/materialize-css/sass/materialize";

By convention, these colors should be moved into a _variables.scss file which is included in styles.scss, but just do whatever feels right, man. I've sent a pull request to the git repo which is currently linked to on the angular2-materialize setup instructions for the latest WebPack version of Angular CLI, so fingers crossed that this little gotcha will not get many more people.